Kwaipilot Markdown Preview
🚀 Enhanced Markdown preview for VSCode with modern UI and powerful features
Transform your Markdown editing experience with this feature-rich preview extension that seamlessly replaces VSCode's native Markdown preview.
✨ Key Features
🎯 Seamless Integration
- Zero Learning Curve: Uses familiar VSCode shortcuts (
Ctrl+Shift+V, Cmd+Shift+V)
- Native Replacement: Completely overrides VSCode's built-in Markdown preview
- One-Click Access: Click the preview button in editor toolbar
🎨 Modern & Beautiful
- Contemporary UI: Built with React + TypeScript + Tailwind CSS
- Theme Adaptive: Automatically matches your VSCode theme
- Responsive Design: Optimized for all screen sizes
📝 Enhanced Rendering
- GitHub Flavored Markdown: Full GFM support
- Math Formulas: KaTeX integration for LaTeX math
- Mermaid Diagrams: Interactive flowcharts, sequence diagrams, and more
- Syntax Highlighting: Beautiful code blocks with copy functionality
🔗 Smart Navigation
- File Jumping: Click on file paths to open files directly
- Line Navigation: Jump to specific lines with
file.js:25 syntax
- Custom Citations: Enhanced reference system with tooltips
🔄 Bidirectional Sync
- Scroll Synchronization: Editor and preview scroll together
- Live Updates: Real-time preview as you type
- Position Tracking: Maintains scroll position during edits
🚀 Quick Start
Installation
- Install from VSCode Marketplace (search "Kwaipilot Markdown Preview")
- Or install via command line:
code --install-extension ai-ide.ai-ide-markdown
Usage
Once installed, the extension automatically takes over Markdown preview:
- Keyboard:
Ctrl+Shift+V (Windows/Linux) or Cmd+Shift+V (Mac)
- Command Palette: Search "Markdown: Open Preview"
- Editor Button: Click the preview icon in the editor toolbar
- Right-click: Select "Open Preview" from context menu
� Advanced Features
File Navigation
Create clickable links to files and specific lines:
Check out `src/extension.ts:25` for the main component
Custom Citations
Enhanced reference system with hover tooltips:
This is a citation [cite:https://example.com:1] with a link
Or without link [cite::2] for internal references
Mermaid Diagrams
Create beautiful diagrams directly in Markdown:
graph TD
A[Start] --> B{Decision}
B -->|Yes| C[Action 1]
B -->|No| D[Action 2]
C --> E[End]
D --> E
Write LaTeX math expressions:
Inline math: $E = mc^2$
Block math:
$$
\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi}
$$
Enjoy enhanced Markdown editing with Kwaipilot Markdown Preview! 🎉
