Skip to content
en
All tools

Categories

Developer ToolsEncoding & DecodingJSON & DataHash & ChecksumText ToolsDate & TimeNetwork ToolsFile ToolsMarkdown & Diagrams

Gantt Chart Generator

List tasks with a start and a duration and get a project timeline with sections and dependencies.

Processed locally in your browser

Options

Used when converting an outline.

One task per line: name | start | duration [| done, active, crit, milestone]. "# Title" starts a section. Empty start = after the previous task.0 chars · 0 lines
The result will appear here.

What is Gantt Chart Generator?

A Gantt chart lays project tasks out on a time axis so you can see durations, overlaps and dependencies at a glance. It is a staple of project planning, roadmaps and release schedules.

In quick mode each line is "Task name | start | duration". The start can be a date, "after <task name>" for a dependency, or empty to follow the previous task. Lines starting with # open sections, and an optional fourth field marks tasks as done, active, crit or milestone. The tool converts this into Mermaid gantt code, lets you choose the date format, axis labels and weekend exclusion, and shows the generated code next to the chart.

How does it work?

  1. Write one task per line as "name | start | duration", for example "Design | 2026-03-02 | 5d".
  2. Use "after Design" as the start for dependent tasks and "# Section" lines to group them.
  3. Choose the date format, axis labels, weekend skipping and a chart title.
  4. Export the chart as SVG or PNG, or copy the generated Mermaid code.

Common use cases

  • Sketching a project plan for a client proposal or kickoff meeting.
  • Visualizing a release schedule with dependent phases.
  • Planning a thesis, event or renovation timeline.
  • Checking how a delay in one task pushes back the following ones.

Examples

Try this input in the tool above:

# Planning
Requirements | 2026-03-02 | 5d | done
Design | | 7d | active
# Build
Backend | after Design | 10d
Frontend | after Design | 12d
# Launch
Testing | after Backend | 5d | crit
Release | after Testing | 1d | milestone

Privacy

Gantt Chart Generator runs entirely in your browser. The text or files you provide are processed on your device and are not uploaded, logged or stored on our servers.

Limitations

Dates must match the selected date format, and the first task needs an explicit start date. Durations use Mermaid units (d, w, h…); calendar exceptions such as holidays need the Mermaid excludes directive in code mode.

Frequently asked questions

What duration units can I use?

Numbers followed by ms, s, m, h, d, w, M or y: for example 5d for five days or 2w for two weeks. You can also give an end date instead of a duration.

How do I make a task depend on another?

Write "after " followed by the exact name of the earlier task in the start field, for example "Backend | after Design | 10d". Leaving the start empty follows the previous task.

Can I change the axis labels on Mermaid code I pasted?

Yes. Choosing an axis format other than Auto inserts or replaces the axisFormat line of pasted gantt code; the dateFormat of your code is never modified.

Related tools

More tools in Markdown & Diagrams →