Markdown Preview Style
A comfortable reading stylesheet for the markdown preview, in every workspace.
You want your markdown previews to read well — a comfortable measure, calmer
headings, code blocks that read as blocks — so you point VS Code's
markdown.styles setting at a CSS file, and the preview answers "Could not
load 'markdown.styles'". That is not a missing file: the preview webview only
loads resources under extension contributions or open workspace folders, so a
path outside the workspace is refused outright.
Markdown Preview Style contributes the stylesheet as a global extension —
every workspace gets it, no per-repo settings, no per-repo CSS files. Nothing
to enable: it applies the moment the extension is installed.
Local override
The bundled style is the opinion; your machine can have the last word. Point
markdownPreviewStyle.localOverride at a CSS file (default
~/.config/markdown-preview-style/override.css) and the extension layers it
over the bundled stylesheet, syncing it in on activation and whenever the
file changes (a window reload applies it). No file, no change: the extension
behaves exactly as before. Set the setting to an empty string to disable.
Install
- VS Code — install from the
VS Code Marketplace,
or
code --install-extension alkisyuv.markdown-preview-style
- Cursor / VSCodium — served from
Open VSX,
or
cursor --install-extension alkisyuv.markdown-preview-style
What it styles
See preview.css — a comfortable reading measure, calmer
heading scale, and code blocks that read as blocks. Tables and code blocks
use the full width; add class="wide" to any HTML block to do the same.
The stylesheet ships as written, with no build step: to try a change, edit
preview.css and package the extension with npx @vscode/vsce package.
License
MIT
