Code Diagram is a diagramming tool that lives inside your VSCode. It helps you to visualize your codebase, understand the architecture, and refactor faster.
Features 💪
1 click to add code snippets to the diagram
Jump back to code from the diagram
27 color themes for code highlighting (dark and light)
192 languages for code highlighting
Storing the diagram as Local files or in the Cloud
Sharing the diagram with a public link (only available in Cloud)
Export to PNG
Markdown editor
Change color for each box
A short demo 🎬
How to use this extension 🤔
Open the command palette (Cmd/Ctrl + Shift + P)
Run: Code Diagram: Add a sample diagram
Select some of your codes
Run: Code Diagram: Snip Code
Voila! You have a diagram directly in your VSCode.
Why build this?
I'm writing codes just like you, and I'm a big fan of diagrams. I use diagrams to visualize my codebase, understand the architecture, and refactor faster.
However, none of the diagram tools that I use is good enough. I have to switch between my code editor and the diagram tool. It's a pain.
So, why not building a diagram tool that lives inside my code editor? That's why I build Code Diagram.
I love to hear your feedback
My email is "huyvu@codediagram.io", feel free to drop me an email on any feedback.
