Understanding the PlantUML Format

What Is PlantUML?

PlantUML is an open-source tool that lets you create diagrams from plain text descriptions. Instead of dragging boxes around a canvas, you write a few lines of simple syntax and PlantUML renders a professional diagram for you. This approach is often called "diagram as code" or "text to diagram."

A minimal PlantUML diagram looks like this: you open with a @start<type> tag, describe the structure in a few readable lines, and close with @end<type>. The tool parses this text and produces an SVG, PNG, or PDF — wherever you render it.

Why write diagrams as text?

• Version control — Plain text diffs cleanly in Git. You can track every change to a diagram, review it in a pull request, and roll back if something breaks.
• Speed — Typing [Task A] lasts 5 days is faster than drawing a bar on a canvas and resizing it.
• Consistency — The rendering engine applies uniform spacing, fonts, and colours automatically. You focus on the content, not the layout.
• Portability — A .puml text file is tiny, human-readable, and renders the same everywhere.
• Automation — Diagrams can be generated programmatically from data, embedded in CI pipelines, and kept in sync with code.

How GanttTool Uses PlantUML

GanttTool gives you a visual GUI editor — you add tasks, set durations, define dependencies, pick colours — but behind the scenes everything you build is compiled into PlantUML code. That code is then sent to a rendering server which converts it to an SVG diagram displayed in your browser.

The rendering pipeline

The API route at /api/kroki acts as a proxy between your browser and the rendering servers. It works in two stages:

• Primary: PlantUML.com server — The PlantUML code is compressed with Deflate (level 9) and encoded using PlantUML's custom base-64 variant. The resulting string is appended to https://www.plantuml.com/plantuml/svg/~1{encoded} as a GET request. A 3-second timeout guards against slow responses.
• Fallback: Kroki.io server — If PlantUML.com fails or times out, the raw PlantUML text is POSTed as text/plain to https://kroki.io/plantuml/svg with a 5-second timeout. Kroki is an open-source rendering gateway that supports many diagram formats.

Whichever server responds first with a valid SVG, that image is returned to the browser with a Content-Type: image/svg+xml header and rendered inline. You never have to think about encoding or fallback — it just works.

PlantUML Gantt Chart Syntax

Every PlantUML Gantt diagram is wrapped in @startgantt / @endgantt tags. Inside, you describe your project in a natural, readable style.

Basic task structure

@startgantt
' Project title and scale
title Website Redesign Project
Project starts 2026-07-01
printscale weekly

' Phase separator
-- Discovery --

' Regular tasks: [Name] lasts N days
[Requirements gathering] lasts 5 days
[Competitor analysis] lasts 3 days

-- Design --

[Wireframes] lasts 7 days
[Visual design] lasts 10 days
[Visual design] starts at [Wireframes]'s end

-- Development --

[Frontend build] lasts 14 days
[Frontend build] starts at [Visual design]'s end
[Backend integration] lasts 10 days
[Backend integration] starts at [Frontend build]'s end

@endgantt

Milestones

Milestones have zero duration and appear as a diamond marker on the timeline. Define them with happens at rather than lasts.

@startgantt
Project starts 2026-07-01

[Development] lasts 14 days and is colored in CornflowerBlue
[QA Testing] lasts 5 days and is colored in LightGreen
[QA Testing] starts at [Development]'s end

' Milestone — happens at a specific task's end
[Release v1.0] happens at [QA Testing]'s end

' Completion percentage
[Development] is 70% completed

@endgantt

Phase separators & project settings

Wrap section names between double dashes (-- Phase name --) to insert a separator row. Combine with project-wide settings for full control.

@startgantt
title Q3 Product Launch
Project starts 2026-07-01
printscale weekly zoom 2
saturday are closed
sunday are closed
today is colored in Lavender

-- Planning --
[Kickoff meeting] lasts 1 day
[Scope definition] lasts 3 days
[Scope definition] starts at [Kickoff meeting]'s end

-- Build --
[Engineering sprint 1] lasts 10 days
[Engineering sprint 1] starts at [Scope definition]'s end
[Engineering sprint 2] lasts 10 days
[Engineering sprint 2] starts at [Engineering sprint 1]'s end

-- Launch --
[Smoke testing] lasts 2 days
[Smoke testing] starts at [Engineering sprint 2]'s end
[Go live] happens at [Smoke testing]'s end

@endgantt

Key Gantt syntax at a glance

PlantUML Beyond Gantt Charts

Gantt is just one of over a dozen diagram types PlantUML supports. The same plain-text philosophy — start tag, description, end tag — applies to all of them. Here is a tour of the most widely used types.

@startuml
title User Login Flow

Browser -> API: POST /login {email, password}
API -> Database: SELECT user WHERE email=?
Database --> API: user record
alt valid credentials
    API --> Browser: 200 OK + JWT token
else invalid
    API --> Browser: 401 Unauthorized
end
@enduml

@startuml
class Project {
    +id: String
    +name: String
    +startDate: Date
    +getTasks(): Task[]
}

class Task {
    +id: String
    +name: String
    +duration: Number
    +complete(): void
}

class Milestone {
    +name: String
    +date: Date
}

Project "1" o-- "many" Task
Project "1" o-- "many" Milestone
Task <|-- Milestone
@enduml

More PlantUML diagram types

Here is a quick example of a PlantUML mind map to illustrate how non-Gantt diagrams follow the same text-first philosophy:

@startmindmap
* Project Planning
** Scope
*** Requirements
*** Deliverables
** Schedule
*** Gantt chart
*** Milestones
** Team
*** Roles
*** Resources
** Risks
*** Mitigation plan
@endmindmap

Try PlantUML Online

You do not need to install anything to start experimenting with PlantUML. The ecosystem has excellent free online renderers:

Start Creating Gantt Diagrams

GanttTool gives you the power of PlantUML without needing to write a single line of code. Use the visual editor to build your project schedule, and let the app handle the PlantUML syntax and diagram rendering automatically.

• Add tasks, milestones, and phase separators with one click.
• Set durations, dependencies, colours, and completion percentages visually.
• Inspect the generated PlantUML code at any time — copy and reuse it anywhere.
• Export as SVG or copy to clipboard as PNG for presentations and docs.
• Describe your project in plain English and let the AI assistant generate a full Gantt draft.