Readable Markdown
A beautiful, reading-friendly preview for Markdown files in VS Code. Inspired by iA Writer and quality reading apps.
Features
- Serif typography — Lora, Merriweather, PT Serif, Georgia, or Palatino
- Comfortable line width — constrained column (~680px) so your eye doesn't have to travel
- Clean visual hierarchy — headings, lists, and code blocks that breathe
- Three themes — Light, Warm (sepia-ish), Dark
- Frontmatter display — renders YAML frontmatter as a subtle metadata bar
- Live update — re-renders as you edit the source file
- GFM support — tables, strikethrough, task lists via
marked
Usage
With a .md file active:
- Keyboard:
Cmd+Shift+R (Mac) / Ctrl+Shift+R (Win/Linux)
- Editor title bar: click the book icon
📖
- Right-click the file in Explorer → "Open Reading View"
Configuration
| Setting |
Default |
Options |
readable-md.fontFamily |
Lora |
Lora, Georgia, Palatino Linotype, Merriweather, PT Serif |
readable-md.fontSize |
17 |
12–24 |
readable-md.lineWidth |
680 |
400–1000 |
readable-md.theme |
light |
light, warm, dark |
Installation (Development)
cd readable-md
npm install
npm run compile
# Then press F5 in VS Code to launch Extension Development Host
To package as a .vsix:
npm install -g @vscode/vsce
vsce package
# Install: code --install-extension readable-md-0.1.0.vsix
| |