Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Markdown Preview Github StylingNew to Visual Studio Code? Get it now.
Markdown Preview Github Styling

Markdown Preview Github Styling

Matt Bierner

|
2,244,576 installs
| (37) | Free
Changes VS Code's built-in markdown preview to match Github's style
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Changes VS Code's built-in markdown preview to match GitHub's styling.

Includes support for both light and dark GitHub themes. By default, the theme type (light vs dark) is selected based on your VS Code theme.

❗️ Important: This extension only styles the Markdown preview. Use this extension pack to add support for other GitHub markdown features like :emoji: and - [ ] tasklists.

Features

  • Preview what your markdown will look like on GitHub.
  • Extends VS Code's built-in markdown preview.
  • Includes Github's Dark and Light themes, along with Github's dark dimmed, high contrast, and color blind accessible themes.
  • Customize styling using your own markdown.styles css
    • Make sure you apply your styles to the .github-markdown-body instead of just body so they don't get overridden by this extension

Usage

Please see the VSCode Markdown Preview documentation for instructions on how to use this extension.

Configuration

By default, this extension uses the Github theme that matches VS Code's color theme (light/dark). These settings let you further customize which Github theme the Markdown preview uses.

  • markdown-preview-github-styles.colorTheme

    Sets the color theme mode for the styling of the Markdown preview. Default: auto.

    • Auto (match editor): Automatically match the editor color theme (light/dark).
    • System: Sync to the system/OS color theme.
    • Single theme: Light: Always use the selected Light theme. See markdown-preview-github-styles.lightTheme
    • Single theme: Dark: Always use the selected Dark theme. See markdown-preview-github-styles.darkTheme
  • markdown-preview-github-styles.lightTheme and markdown-preview-github-styles.darkTheme.

    Specify the theme used when in Light/Dark mode. Only the matching setting applies when colorTheme is in Single theme mode.

    Available themes:

    • Light - light
    • Light high contrast - light_high_contrast
    • Light Protanopia & Deuteranopia - light_colorblind
    • Light Tritanopia - light_tritanopia
    • Dark - dark
    • Dark high contrast - dark_high_contrast
    • Dark Protanopia & Deuteranopia - dark_colorblind
    • Dark Tritanopia - dark_tritanopia
    • Dark dimmed - dark_dimmed
  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft