A Notion-like WYSIWYG editor for Markdown files in VS Code.
- Notion-style editing — Write markdown with a beautiful block-based interface
- Real-time preview — See your formatting instantly as you type
- Auto-save — Changes are saved automatically, just like Notion
- VS Code theme support — Adapts to your light/dark theme
- Slash commands — Type
/to insert blocks (headings, lists, code, callouts) - Keyboard shortcuts —
Cmd+Bfor bold,Cmd+Ifor italic,Cmd+Ufor underline - Callouts/Alerts — Info, warning, error, and success callout blocks
- Code blocks — Syntax-highlighted code with language selection
- Checkboxes — Interactive task lists
- Tables — Create and edit tables visually
- Open VS Code
- Go to Extensions (
Cmd+Shift+X) - Search for "Markdown Ninja"
- Click Install
- Download the
.vsixfile from Releases - In VS Code:
Cmd+Shift+P→ "Install from VSIX" - Select the downloaded file
- Open any
.mdor.markdownfile - Start editing with the visual editor
- Use
/to open the slash menu and insert blocks - Your changes are saved automatically
| Shortcut | Action |
|---|---|
Cmd+B |
Bold |
Cmd+I |
Italic |
Cmd+U |
Underline |
/ |
Open slash menu |
Type / and then:
heading— Insert heading (H1, H2, H3)bullet— Bullet listnumbered— Numbered listcheckbox— Task listcode— Code blockinfo/warning/error/success— Callout blockstable— Insert tableimage— Insert image
- VS Code 1.85.0 or higher
- Syntax highlighting in code blocks requires manual language selection
- GitHub-style alerts (
> [!NOTE]) use internal format for now
Contributions are welcome! Please feel free to submit a Pull Request.
MIT License - see LICENSE for details.
Built with BlockNote — the open-source block-based editor.
Enjoy! If you like this extension, please leave a review on the Marketplace.