Need help with github-markdown-css?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

sindresorhus
5.8K Stars 1.8K Forks MIT License 114 Commits 4 Opened issues

Description

The minimal amount of CSS to replicate the GitHub Markdown style

Services available

!
?

Need anything else?

Contributors list

# 218
node
exec
test-fr...
nextjs
103 commits
# 73,949
PHP
paypal
php7
opcache
1 commit
# 141,225
Shell
Neovim
CSS
HTML
1 commit
# 3,725
lodash
bittorr...
express...
Markdow...
1 commit
# 25,375
algolia...
React
reasonm...
ecmascr...
1 commit
# 12,380
React
mermaid
Markdow...
codemir...
1 commit
# 6,681
React
Dart
bitbuck...
gitee
1 commit
# 13,411
C++
android...
oauth2
Google
1 commit
# 389,205
CSS
HTML
Shell
fiber
1 commit

github-markdown-css

The minimal amount of CSS to replicate the GitHub Markdown style

The CSS is generated. Contributions should go to this repo.

Demo

Install

Download manually, from CDNJS, or with npm:

$ npm install github-markdown-css

Usage

Import the

github-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.

Unicorns

All the things

If you want code syntax highlighted, use GitHub Flavored Markdown rendered from GitHub's

/markdown
API.

There are 3 themes provided in this package:

  • github-markdown.css: (default) Automatically switches between light and dark through
    @media (prefers-color-scheme)
    .
  • github-markdown-light.css: Light-only.
  • github-markdown-dark.css: Dark-only.

You may know that now GitHub supports more than 2 themes including

dark_dimmed
,
dark_high_contrast
and
colorblind
variants. If you want to try these themes, you can generate them on your own! See next section.

How

See

generate-github-markdown-css
for how it's generated and ability to generate your own.

Dev

Run

npm run make
to update the CSS.

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.