{"id":13399907,"url":"https://github.com/sindresorhus/github-markdown-css","last_synced_at":"2025-05-13T10:59:12.812Z","repository":{"id":16786282,"uuid":"19544711","full_name":"sindresorhus/github-markdown-css","owner":"sindresorhus","description":"The minimal amount of CSS to replicate the GitHub Markdown style","archived":false,"fork":false,"pushed_at":"2024-12-20T15:16:57.000Z","size":343,"stargazers_count":8326,"open_issues_count":13,"forks_count":2108,"subscribers_count":91,"default_branch":"main","last_synced_at":"2025-05-13T10:58:54.545Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://sindresorhus.com/github-markdown-css","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sindresorhus.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":"license","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":".github/security.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":"sindresorhus","open_collective":"sindresorhus","buy_me_a_coffee":"sindresorhus","custom":"https://sindresorhus.com/donate"}},"created_at":"2014-05-07T18:03:02.000Z","updated_at":"2025-05-13T05:57:06.000Z","dependencies_parsed_at":"2023-10-13T05:37:35.199Z","dependency_job_id":"500b7ffb-34e4-4e02-b34f-81983d1c6dc6","html_url":"https://github.com/sindresorhus/github-markdown-css","commit_stats":{"total_commits":132,"total_committers":11,"mean_commits":12.0,"dds":0.0757575757575758,"last_synced_commit":"74e1bcc0522c478c3c83e04430784614795312a0"},"previous_names":[],"tags_count":51,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sindresorhus%2Fgithub-markdown-css","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sindresorhus%2Fgithub-markdown-css/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sindresorhus%2Fgithub-markdown-css/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sindresorhus%2Fgithub-markdown-css/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sindresorhus","download_url":"https://codeload.github.com/sindresorhus/github-markdown-css/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253929359,"owners_count":21985802,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-30T19:00:44.892Z","updated_at":"2025-05-13T10:59:12.763Z","avatar_url":"https://github.com/sindresorhus.png","language":"CSS","readme":"# github-markdown-css\n\n\u003e The minimal amount of CSS to replicate the GitHub Markdown style\n\n**The CSS is generated. Contributions should go to [this repo](https://github.com/sindresorhus/generate-github-markdown-css).**\n\n[\u003cimg src=\"https://cloud.githubusercontent.com/assets/170270/5219062/f22a978c-7685-11e4-8316-af25b6c89bc0.png\" width=\"300\"\u003e](http://sindresorhus.com/github-markdown-css)\n\n## [Demo](https://sindresorhus.com/github-markdown-css)\n\n## Install\n\nDownload [manually](https://raw.githubusercontent.com/sindresorhus/github-markdown-css/gh-pages/github-markdown.css), from [CDNJS](https://cdnjs.com/libraries/github-markdown-css), or with npm:\n\n```sh\nnpm install github-markdown-css\n```\n\n## Usage\n\nImport 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.\n\n```html\n\u003cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1\"\u003e\n\u003clink rel=\"stylesheet\" href=\"github-markdown.css\"\u003e\n\u003cstyle\u003e\n\t.markdown-body {\n\t\tbox-sizing: border-box;\n\t\tmin-width: 200px;\n\t\tmax-width: 980px;\n\t\tmargin: 0 auto;\n\t\tpadding: 45px;\n\t}\n\n\t@media (max-width: 767px) {\n\t\t.markdown-body {\n\t\t\tpadding: 15px;\n\t\t}\n\t}\n\u003c/style\u003e\n\u003carticle class=\"markdown-body\"\u003e\n\t\u003ch1\u003eUnicorns\u003c/h1\u003e\n\t\u003cp\u003eAll the things\u003c/p\u003e\n\u003c/article\u003e\n```\n\nYou can use [GitHub's `/markdown` API](https://docs.github.com/en/free-pro-team@latest/rest/reference/markdown) to turn Markdown into the HTML that GitHub generates, which works well with the CSS in this repo. Other Markdown parsers will mostly work with these styles too. To mimic how GitHub highlights code, you can use [`starry-night`](https://github.com/wooorm/starry-night) with your Markdown parser of choice.\n\nThere are 3 themes provided in this package:\n\n- **github-markdown.css**: (default) Automatically switches between light and dark through [`@media (prefers-color-scheme)`](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme).\n- **github-markdown-light.css**: Light-only.\n- **github-markdown-dark.css**: Dark-only.\n\nYou 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.\n\n## How\n\nSee [`generate-github-markdown-css`](https://github.com/sindresorhus/generate-github-markdown-css) for how it's generated and ability to generate your own.\n\n## Troubleshooting\n\nIf you encounter styling issues, like tables in dark mode rendering their fonts in black, the browser might uses [quirks mode](https://developer.mozilla.org/en-US/docs/Web/HTML/Quirks_Mode_and_Standards_Mode) by accident.\n\nTo avoid quirks mode, always include a doctype at the top of your page.\n\n```html\n\u003c!doctype html\u003e\n\u003chtml lang=\"en\"\u003e\u003chead\u003e\u003c/head\u003e\u003cbody\u003e\u003c/body\u003e\u003c/html\u003e\n```\n\n## Dev\n\nRun `npm run make` to update the CSS.\n","funding_links":["https://github.com/sponsors/sindresorhus","https://opencollective.com/sindresorhus","https://buymeacoffee.com/sindresorhus","https://sindresorhus.com/donate"],"categories":["CSS","HTML","HarmonyOS","Uncategorized","markdown","Other"],"sub_categories":["Windows Manager","Uncategorized"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsindresorhus%2Fgithub-markdown-css","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsindresorhus%2Fgithub-markdown-css","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsindresorhus%2Fgithub-markdown-css/lists"}