Turn your codes into
diagrams
within seconds
From codes to diagrams and from diagrams to codes, all in one place.
How it works
Step 1
Install VSCode extension
From the marketplace or directly from your VSCode
Step 2
Open the canvas
Use split screen to see both of your codes and diagrams at the
same time
Step 3
Snip Codes!
Select some codes, snip them, and the diagrams
will be automatically created
Diagram & Codes
side-by-side
-
No more switching contextYou can see both of your codes and diagrams at the same time
-
Auto code formatting and highlightingWe optimize to make your code look good in the diagram
-
192 languages supportedHighlight your code in any language you want
-
Jump back to your code from the diagramClick on the diagram and it will open the code file for you
Multiple color themes
When it comes to color themes, everyone has their own preferences. So we
have made sure that you can choose from a wide range of color themes for
your diagrams
Share it with your team
Just copy the diagram link and share it with your team.
Great for code review, great for pair programming.
Below is a live diagram built from CodeDiagram's codebase itself!
Get started in minutes
We're now open for early access!