Overview Version History Q & A Rating & Review
Reviewer - PlantUML Viewer
Transform PlantUML diagrams into interactive SVG previews directly within VS Code, powered by the ReViewer engine.100% offline & client-side — zero server dependencies, no external Java / Graphviz installation needed.
📄 License: MIT ⚡ Zero Server Dependencies
✨ Features
Instant Live Preview : Automatically updates diagrams in real time as you edit your .puml files.Interactive Zoom & Pan :
Smooth mouse wheel zoom (zooms precisely towards the cursor).
Drag-and-drop canvas panning.
Quick-access controls: Zoom In (+), Zoom Out (-), Reset (100%), and Fit to Window.
Copy to Clipboard :
Copy SVG : 1-click copy of standard SVG markup.Copy PNG : High-resolution bitmap image copied directly to clipboard.
Export to File :
Save diagram as .svg vector file via VS Code save dialog.
Save diagram as .png image file.
Theme Synchronization : Adapts automatically to VS Code Dark, Light, and High Contrast color themes.100% Offline & Private : Renders diagrams locally using render.min.js. Your diagram code never leaves your computer.
🚀 Quick Start
1. Open a PlantUML File
Open any PlantUML file (.puml, .plantuml, .wsd, .iuml) in your editor.
2. Launch the Preview
You can open the live preview in two ways:
Click the Reviewer: Open Preview to the Side icon in the editor title bar.
Open the Command Palette (Cmd+Shift+P on macOS / Ctrl+Shift+P on Windows/Linux) and run:
Reviewer: Open Preview to the SideReviewer: Open PlantUML Preview
3. Live Editing
Edit your diagram source code and watch the preview update instantly side-by-side.
📊 Supported Diagram Types
Sequence Diagrams (@startuml ... @enduml)Activity Diagrams (start ... stop, if (...) then (...))Class & Object Diagrams (class, interface, relationships)Mindmaps (@startmindmap ... @endmindmap)Work Breakdown Structure (WBS) (@startwbs ... @endwbs)Timing Diagrams (@starttiming ... @endtiming)State Diagrams (@startstate ... @endstate)Data Diagrams (@startjson, @startyaml)
💬 Support & Inquiries
