github-markdown-css

github-markdown-css is a small CSS package whose stated purpose is to reproduce the visual style GitHub applies to rendered Markdown, using the minimal amount of CSS needed. The stylesheet is generated rather than hand-edited; the README directs contributions to the separate generate-github-markdown-css repository. Usage is straightforward: import github-markdown.css, add a markdown-body class to the container holding your rendered Markdown, and set a width. The README notes GitHub uses 980px width with 45px padding, and 15px padding on mobile, and provides an example with box-sizing, min-width, max-width, margin auto, and a media query for narrow viewports. A dark-mode background color is also shown via prefers-color-scheme. The package ships seven themes: a default that switches between light and dark automatically through prefers-color-scheme, light-only, dark-only, dark dimmed, dark high contrast, dark colorblind (protanopia and deuteranopia), and light colorblind variants. For HTML that matches these styles, the README suggests GitHub's /markdown API, which produces the HTML GitHub itself generates. It notes that other Markdown parsers will mostly work with the styles too, and recommends starry-night for code highlighting that mimics GitHub. Installation options include downloading the file manually, using CDNJS, or npm install github-markdown-css. A demo page is linked. A troubleshooting note explains that styling problems such as black table fonts in dark mode can result from the browser falling into quirks mode; including a doctype at the top of the page avoids this. For development, npm run make updates the CSS.