# Gantt chart generator for Mermaid Turn a task list with start dates, durations and dependencies into Mermaid gantt chart code. Sections, milestones, weekend exclusions and Markdown fencing. ## Run it - **CLI:** `gizza tool gantt-mermaid-generator "section Design Wireframes | 2026-03-02 | 5d | done Visual design | after Wireframes | 1w | active Design sign-off | after Visual design | | milestone"` - **Web:** https://gizza.ai/tools/gantt-mermaid-generator/ - **Agents:** machine-readable descriptor (parameters JSON Schema) at https://gizza.ai/tools/gantt-mermaid-generator/tool.json ## Inputs - `tasks` — Tasks (name | start | duration | tags | id) _(field)_ - `title` — Chart title _(field)_ - `delimiter` — Column delimiter _(field)_ - `date_format` — Date format _(field)_ - `axis_format` — Axis label format _(field)_ - `tick_interval` — Axis tick interval _(field)_ - `exclude_weekends` — Skip weekends _(field)_ - `weekend` — Weekend starts on _(field)_ - `excludes` — Other non-working days _(field)_ - `today_marker` — Show the today marker _(field)_ - `compact` — Compact display mode _(field)_ - `fence` — Wrap in a Markdown mermaid fence _(field)_ ## Output - Mermaid gantt source (text) ## Query parameters Open the tool pre-filled and auto-run via URL: - `tasks` — Tasks (name | start | duration | tags | id) - `title` — Chart title - `delimiter` — Column delimiter - `date_format` — Date format - `axis_format` — Axis label format - `tick_interval` — Axis tick interval - `exclude_weekends` — Skip weekends - `weekend` — Weekend starts on - `excludes` — Other non-working days - `today_marker` — Show the today marker - `compact` — Compact display mode - `fence` — Wrap in a Markdown mermaid fence Example: `https://gizza.ai/tools/gantt-mermaid-generator/?tasks=section%20Design%0AWireframes%20%7C%202026-03-02%20%7C%205d%20%7C%20done%0AVisual%20design%20%7C%20after%20Wireframes%20%7C%201w%20%7C%20active%0ADesign%20sign-off%20%7C%20after%20Visual%20design%20%7C%20%7C%20milestone&title=Q2%20launch%20plan&delimiter=auto&date_format=YYYY-MM-DD&axis_format=%25b%20%25d&tick_interval=1week&exclude_weekends=true&weekend=saturday&excludes=2026-04-03%2C%202026-04-06&today_marker=true&compact=true&fence=true` --- ## Write the plan, not the syntax Mermaid's `gantt` syntax is compact but fussy: every task needs an id before you can point another task at it, tags have to come first in the spec, and one stray colon in a task name breaks the whole diagram. This tool takes the plan in the shape you already think about it — a task, when it starts, how long it takes — and writes the Mermaid source for you. Everything runs locally in your browser. The task list never leaves your machine. ## The task table One task per line, up to five columns, separated by a pipe (`|`), a tab, or a comma: ``` name | start | duration | tags | id ``` - **name** — the label shown on the bar. Required. A colon in the name is replaced with a hyphen, because Mermaid uses the colon to separate the label from the task spec. - **start** — a date in your chosen date format, `after ` to begin when another task ends, or **left empty** to follow the task on the line above. Chain several with `after Design, Research`. - **duration** — a length such as `5d`, `2w`, `36h`, `1.5d`, or a bare number meaning days. You can also give an end date instead, or `until ` to run right up to another task's start. - **tags** — any of `done`, `active`, `crit`, `milestone`, space separated. Milestones with no duration become zero-length markers automatically. - **id** — optional. An id is derived from the task name, so `after Visual design` just works; supply your own only when you want a short handle. A line starting with `section ` or `## ` opens a section. Blank lines, and lines starting with `#`, `//` or `%%`, are ignored — so you can keep notes in the plan. ## Worked example Input: ``` section Design Wireframes | 2026-03-02 | 5d | done Visual design | after Wireframes | 1w | active Design sign-off | after Visual design | | milestone ``` with the title `Q2 launch plan`, axis format `%b %d`, tick interval `1week` and **skip weekends** turned on, produces: ``` gantt title Q2 launch plan dateFormat YYYY-MM-DD axisFormat %b %d tickInterval 1week excludes weekends section Design Wireframes :done, wireframes, 2026-03-02, 5d Visual design :active, visual_design, after wireframes, 1w Design sign-off :milestone, design_sign_off, after visual_design, 0d ``` Paste that into a GitHub or GitLab comment, a Markdown file, a Notion code block, an Obsidian note, or any Mermaid-compatible viewer and it renders as a timeline. Turn on **Wrap in a Markdown mermaid fence** to get the surrounding ```` ```mermaid ```` block too. ## Chart options | Option | What it does | | ------ | ------------ | | Chart title | Adds a `title` line above the timeline. | | Date format | How you write dates, from `YYYY-MM-DD` to `DD/MM/YYYY` or Unix seconds. Also validates every date you type. | | Axis label format | Mermaid's `axisFormat`, a strftime pattern such as `%b %d` or `%d/%m`. | | Axis tick interval | Mermaid's `tickInterval` — `1week`, `2day`, `6hour`, `1month`. | | Skip weekends | Adds `weekends` to the `excludes` line so bars step over Saturday and Sunday. | | Weekend starts on | Moves the weekend to Friday+Saturday (needs Mermaid 11 or newer). | | Other non-working days | Extra excluded dates or weekday names, e.g. `2026-04-03, monday`. | | Show the today marker | Off emits `todayMarker off` — useful for a historical or illustrative chart. | | Compact display mode | Packs non-overlapping tasks onto shared rows (needs Mermaid 10 or newer). | ## Limits and edge cases - Up to **500 tasks**, **100 sections** and **2 MB** of input. - Dependencies must point at a task defined **earlier** in the list. Mermaid resolves `after` chains top-down, so a forward reference would silently render at the wrong date — you get an error naming both lines instead. - Dates are checked against the format you picked. `03/02/2026` under `YYYY-MM-DD` is rejected, with the line number and the expected format. - Repeated task names get distinct ids (`review`, `review_2`), so duplicates never collide. - Nothing here computes calendar dates: durations, weekend skipping and `after` chains are resolved by Mermaid when it renders. That is also why excluded days lengthen a bar rather than move it. - With the comma delimiter a task name containing a comma splits into extra columns — switch the delimiter to pipe for those. ## FAQ
Do I have to invent an id for every task? No. An id is derived from the task name — `Visual design` becomes `visual_design` — so you can write `after Visual design` and it resolves. The optional fifth column lets you set a short id by hand when you would rather type `after des` than the full name.
How do I add a milestone? Tag the task `milestone` and leave the duration column empty. Milestones are single points in time, so a blank duration becomes `0d` automatically. Give a start date or an `after ` reference to place it — for example `Public launch | after Beta | | milestone`.
Why does my task start on the wrong day when weekends are excluded? Mermaid applies `excludes` by extending a bar over the skipped days, not by moving its start. A five-day task starting on a Thursday with weekends excluded finishes the following Wednesday. If a task must not begin on a weekend, give it an explicit start date on a working day.
Can I mark work as done, in progress or critical? Yes — put `done`, `active` or `crit` in the tags column, space separated if you want more than one. They map to Mermaid's built-in styling: completed bars, the in-progress highlight, and the critical emphasis. The generator reorders them into the sequence Mermaid expects, so `crit done` is fine.
What date formats can I use? Pick one from the date format list and write every date that way: ISO `2026-03-02`, day-first `02/03/2026`, month-first `03/02/2026`, slash or hyphen separated, with an optional time, or Unix epoch seconds. The choice is emitted as Mermaid's `dateFormat` and used to validate your input, so a typo is caught here rather than rendering as an empty chart.
Where does the generated code actually render? Anywhere Mermaid runs: GitHub and GitLab Markdown, Notion and Obsidian code blocks, MkDocs and Docusaurus sites, the Mermaid live editor, and most modern wikis. Compact display mode needs Mermaid 10 or newer, and moving the weekend to Friday needs Mermaid 11 or newer; everything else works on older versions too.
## Related tools - [Mermaid from data](https://gizza.ai/tools/mermaid-from-data/): Turn structured node and edge rows into Mermaid flowchart, classDiagram or erDiagram source with labels, shapes and relationship styles. - [Markdown Section Extractor](https://gizza.ai/tools/markdown-section-extractor/): Extract one section from a Markdown document by heading — keep or drop subsections, exact or substring match, ATX and setext. Free, in your browser. - [Convert Markdown ↔ Jira Wiki Markup](https://gizza.ai/tools/markdown-to-jira/): Convert Markdown to Jira wiki markup and back locally. Handles headings, lists, tables, code blocks, links, images, quotes, and common panels. - [Export Markdown Notes to HTML](https://gizza.ai/tools/notes-to-html-export/): Combine Markdown notes into one standalone HTML page with embedded CSS, sanitized output and a linked table of contents. - [Docker Compose to Mermaid diagram](https://gizza.ai/tools/compose-to-diagram/): Convert docker-compose.yml into Mermaid flowchart text showing services, dependencies, ports, volumes, and networks.