PlantUML Online Editor and Viewer
Type or paste PlantUML code and the diagram updates as you write. You can open a .puml file, a PlantUML link or the code ChatGPT gave you, then download the diagram as PNG, SVG or a draw.io file.
PlantUML code
You can paste code with or without @startuml, and Markdown code fences from ChatGPT or Claude are removed for you.
Diagram
Copy link puts the whole diagram inside the link, the same way plantuml.com does, so it opens here or on any PlantUML server.
How to Use the PlantUML Editor
- Write your PlantUML code in the box on the left, or pick a template such as a sequence or class diagram to start from.
- The diagram on the right redraws a moment after you stop typing. If there's a mistake, the line number turns red and the message under the editor tells you what PlantUML didn't understand.
- When it looks right, download it as a PNG for documents and slides, an SVG if you want it to stay sharp at any size, or a .drawio file to open in diagrams.net.
Your work is kept in this browser, so if you close the tab by accident the diagram is still there when you come back. To send it to someone, use Copy link or the Share button.
What Is PlantUML?
PlantUML is a way of making diagrams by writing a few lines of text instead of dragging boxes around. You write something like Alice -> Bob: Hello and PlantUML works out where everything goes and draws the arrows for you. It was made for UML diagrams, which are the standard diagrams software teams use to describe how a program is built, but it also draws mind maps, Gantt charts, database diagrams and more.
Developers like it because a diagram written as text can live next to the code, be changed in a few seconds and be tracked in Git like any other file. It's also become popular because AI chatbots are good at writing it. If you ask ChatGPT, Claude or Gemini to draw a diagram, they often answer with PlantUML code, and this page is a quick place to turn that code into a picture.
How to Open a .puml File
A .puml file is a plain text file with PlantUML code inside. You'll also see the same thing saved as .plantuml, .pu, .iuml or .wsd. To see the diagram, drag the file onto the editor above or press Open file. If the file holds more than one diagram, a menu appears above the preview so you can switch between them.
You can open a .puml file in any text editor to read the code, but you won't see the picture that way. On your own computer you'd normally need Java, Graphviz and the PlantUML program, or an extension for VS Code or IntelliJ. This page draws the diagram right in your browser, so there's nothing to install.
Paste PlantUML From ChatGPT or Claude
Ask the chatbot something like "write PlantUML for a sequence diagram of a user logging in", copy its answer and paste it into the editor. The editor strips the ```plantuml lines that chatbots wrap code in. If the diagram shows an error, the message usually points straight at the line the AI got wrong, and you can paste that message back into the chat and ask it to fix the code.
PlantUML and draw.io (diagrams.net)
draw.io used to let you insert PlantUML diagrams, but in June 2025 it announced that PlantUML would be removed from the online editor at app.diagrams.net at the end of 2025, and from its Confluence and Jira apps in 2028. If you have an old .drawio file with PlantUML diagrams in it, open that file here. The editor finds the PlantUML code saved inside it so you can keep editing the diagram.
Going the other way, the draw.io download gives you a .drawio file that opens in diagrams.net with your diagram on the page as an image. The PlantUML code is saved inside the file as well, so you can bring it back here later and carry on editing.
PlantUML Cheat Sheet
These are the pieces of syntax people look up most often. Every diagram goes between a start line and an end line.
| What you want | What to type |
|---|---|
| Start and end a diagram | @startuml ... @enduml |
| Add a title | title My diagram |
| Solid arrow with a label | Alice -> Bob: Hello |
| Dashed reply arrow | Bob --> Alice: Hi |
| People and systems in a sequence | actor User participant App database DB |
| If and else in a sequence | alt Success ... else Failure ... end |
| Class with fields and methods | class Book { +title: String +isAvailable(): Boolean } |
| Inheritance and composition | Animal <|-- Dog Car *-- Engine |
| Activity step and decision | :Do something; if (Ready?) then (yes) :Go; endif |
| Notes | note right of Alice: Some text |
| Comments | ' This line is ignored |
| Left to right layout | left to right direction |
| A built-in theme | !theme cerulean |
PlantUML or Mermaid?
Mermaid is the other well known text to diagram language. GitHub, GitLab, Notion and Obsidian draw Mermaid diagrams inside Markdown without any setup, which makes it handy for READMEs and notes. PlantUML has been around longer and covers more diagram types, including proper UML use case, component, deployment and timing diagrams, plus C4 architecture diagrams through its standard library. It also gives you more control over layout and styling.
A simple way to choose is to use Mermaid when the diagram needs to show up inside Markdown on GitHub, and PlantUML when you need a diagram type Mermaid doesn't have or you're working with a team that already uses it.
Frequently Asked Questions
Is this PlantUML editor free?
Yes. It's free to use, you don't need an account and the downloads have no watermark.
Do I need Java or Graphviz installed?
No. The editor uses the official PlantUML engine built for the browser, which includes its own copy of Graphviz, so the diagram is drawn on your device without installing anything.
Is my diagram uploaded anywhere?
The diagram is drawn in your browser and your code isn't sent to a server while you work. It only leaves your device if you press Share, which saves a copy on Fix42 so the short link works. Copy link keeps the diagram inside the link itself.
Can I open a link from plantuml.com?
Yes. Press Open a PlantUML link and paste a plantuml.com, editor.plantuml.com or PlantText style link, or just the encoded part after /uml/. You can also paste the link straight into the editor and it will be turned back into code.
Does it support C4 diagrams and !include?
C4 diagrams work, using lines such as !include <C4/C4_Container>. Other standard library sets like AWS, Azure and Kubernetes icons are fetched from PlantUML's own site the first time you use them. Includes that point at a file on your computer, like !include styles.puml, can't be read from a web page, so paste that file's contents into the diagram instead.
Why does my diagram say Syntax Error?
PlantUML stops at the first line it can't understand. The line number shows in red next to the editor, and Go to line jumps to it. Common causes are a missing end or endif, a quote that was never closed, or an arrow with no name on one side.
How do I get a high resolution image?
Download the SVG if the program you're using accepts it, because it stays sharp at any size. The PNG download is drawn at twice the normal size, which looks crisp in documents and slides.
Related Tools
If your diagram is going into documentation, you can write the rest of it in the Markdown Preview tool. You can turn the SVG download into a JPG or WebP with SVG Code to Image, and tidy up JSON before you draw it with the JSON Formatter.