# star-markdown-css > Markdown Css about starry. ![Demo](https://github.com/YunYouJun/star-markdown-css/workflows/Demo/badge.svg) [![npm](https://img.shields.io/npm/v/star-markdown-css.svg)](https://www.npmjs.com/package/star-markdown-css/) [![npm](https://img.shields.io/npm/dt/star-markdown-css.svg)](https://npm-stat.com/charts.html?package=star-markdown-css) ![npm bundle size (minified + gzip)](https://img.shields.io/bundlephobia/minzip/star-markdown-css.svg) ![npm bundle size (minified)](https://img.shields.io/bundlephobia/min/star-markdown-css.svg) [![jsDelivr hits (npm)](https://img.shields.io/jsdelivr/npm/hm/star-markdown-css)](https://cdn.jsdelivr.net/npm/star-markdown-css/dist/yun/yun-markdown.min.css) - [Demo](https://smc.yunyoujun.cn) ## Theme ![Planet](./demo/public/img/planet.png) ![Blood](./demo/public/img/blood.png) - [x] Planet(default): violet wandering planet - [ ] Blood - [ ] Pure ## Install By ### Download - Download [manually](https://github.com/YunYouJun/star-markdown-css/archive/main.zip) ### CDN - JSDELIVR: - unpkg: ### Yarn Or NPM ```sh yarn add star-markdown-css # or npm install star-markdown-css ``` ## Usage > Import the `star-markdown.css` file and add a `markdown-body` class to the container of your rendered Markdown and set a width for it. > GitHub uses `980px` width and `45px` padding, and `15px` padding for mobile. ### Html Just use css with link tag. ```html ``` #### Example In HTML In html. ```html

Unicorns

All the things

``` ### Vue Just import it where you need it. ```js import 'star-markdown-css' ``` #### Example In Vue In a vue component. > You can try [vite-plugin-vue-markdown](https://github.com/mdit-vue/vite-plugin-vue-markdown). ```html ``` Or in `main.ts`: ```ts import 'star-markdown-css' // ... ``` ## Dev ### Start ```sh # Install Dependencies pnpm # start dev pnpm dev # You can see in http://localhost:3333 ``` ### Build ```sh yarn build ``` ## Intend - [ ] Add KLK Style (Pure & Blood) - [ ] Use Vue Demo ## Thanks - [github-markdown-css](https://github.com/sindresorhus/github-markdown-css) ## [Sponsors](https://sponsors.yunyoujun.cn)