Richdown
Richdown is a VS Code Markdown editor that keeps writing, previewing, and reviewing changes in one place. It opens Markdown files in a CodeMirror-based rich editor with inline Markdown previews, editable rich tables, Mermaid diagrams, syntax-highlighted code blocks, images, links, task checkboxes, Richdown Diff, and configurable writing themes.
Features
- Opens regular
.md and .markdown files with the Richdown editor by default while keeping Source Control diffs in VS Code's native diff viewer.
- Toggle between Richdown and the standard VS Code text editor from the editor title button or the command palette.
- Open the VS Code Git diff for the current Markdown file from the editor title button or the command palette.
- Open a Richdown Diff view for Markdown changes, including rendered headings, lists, tables, images, links, and highlighted code blocks.
- Preview headings, emphasis, inline code, links, images, blockquotes, task checkboxes, thematic breaks, code blocks, tables, details blocks, and Mermaid diagrams while editing.
- Edit Markdown tables as rich tables, including cell editing, row/column insertion, and row/column deletion.
- Render Mermaid diagrams lazily, with fit, zoom, pan, and modal viewing controls.
- Choose the preview width and theme from the in-editor settings button.
- Switch between the default VS Code theme and several built-in dark/light themes.
Commands
Richdown: Toggle Markdown Open Mode: Switch whether Markdown files open with Richdown or the standard VS Code text editor.
Richdown: Open Rich Diff: Open a Richdown-rendered Markdown diff against HEAD.
Richdown: Open Git Diff: Open the VS Code Git diff for the current Markdown file.
Settings
richdown.openMarkdownAsRichEditor: Open regular local Markdown files with Richdown by default while keeping Source Control diffs in VS Code's native diff editor.
richdown.richTheme: Select the Richdown editor theme. default follows the active VS Code theme.
richdown.showEmptyLineHint: Show the Click to write hint for empty lines.
richdown.richTablePreview: Render Markdown tables as editable rich tables.
richdown.mermaidPreview: Render Mermaid code blocks as diagrams.
richdown.mermaidPreviewSize: Choose the Mermaid preview height behavior.
richdown.previewWidth: Choose the Richdown content width.
Development
Install dependencies and build the bundled webview assets:
npm install
npm run build:all
Run the extension locally:
- Open this folder in VS Code.
- Press
F5 to start the Extension Development Host.
- Open a Markdown file in the new VS Code window.
Package a VSIX:
npm run build:all
npx @vscode/vsce package
Cursor and Open VSX
Cursor and several other VS Code-compatible editors use Open VSX instead of the Visual Studio Marketplace. If Richdown does not appear in Cursor search, install the generated VSIX manually or publish the extension to Open VSX as well.
Install locally from VSIX:
- Run
npm run package:vsix.
- In Cursor, open the command palette.
- Run
Extensions: Install from VSIX....
- Select
richdown-0.3.0.vsix.
Publish to Open VSX:
npx ovsx create-namespace mytooyodev -p <open-vsx-token>
npm run publish:openvsx -- -p <open-vsx-token>
GitHub Actions Deployment
The Deploy Extension workflow packages one VSIX and can publish it to both the Visual Studio Marketplace and Open VSX. It runs automatically when changes are merged into main, and it can also be run manually.
Configure these repository secrets in GitHub:
VSCE_PAT: Visual Studio Marketplace personal access token.
OVSX_PAT: Open VSX personal access token.
Deploy manually:
- Open the repository on GitHub.
- Go to
Actions -> Deploy Extension.
- Run the workflow and choose whether to publish to Marketplace, Open VSX, or both.
Deploy from main:
- Update
package.json and CHANGELOG.md.
- Merge the change into
main.
- The workflow publishes to both registries.
Release Notes
Release notes are tracked in the root CHANGELOG.md file.