Gantt Chart Generator

Create Gantt charts for project planning and tracking tasks. Edit the code on the left and see the diagram update in real-time.

150px
Diagram Code
Untitled Gantt Chart

Syntax Guide

Basic Syntax

  • title [text]Add title to chart
  • section [name]Create a new section
  • [Task name] :[param], [date], [duration]Define a task

Task States and Dependencies

  • :active, :done, :crit, :milestoneTask states
  • [Task] :after [Task]Task dependency
  • 2d, 1w, 1MDuration: days, weeks, months
  • excludes weekendsExclude weekend days
Detailed Date Format Guide

The dateFormat directive sets how dates should be interpreted in your Gantt chart code. It affects how you input dates in your task definitions.

Available Date Formats:
  • YYYY-MM-DDISO format: 2025-05-12Recommended for international use
  • MM/DD/YYYYUS format: 05/12/2025
  • DD/MM/YYYYEuropean format: 12/05/2025
  • DD-MM-YYYYAlternative format: 12-05-2025
  • Q YYYYQuarter format: Q2 2025Good for quarterly planning
  • MM YYYYMonth number and year: 05 2025
  • MMM YYYYAbbreviated month and year: May 2025
  • MMMM YYYYFull month and year: May 2025

Important: The date format you select here affects how you input dates in your task definitions. For example, if you select YYYY-MM-DD, you must write your task dates as 2025-05-12.

Detailed Axis Format Guide

The axisFormat directive controls how dates are displayed on the chart's timeline axis. This affects the visual representation only, not how you input dates.

Available Axis Formats:
  • %Y-%m-%dYear-Month-Day: 2025-05-12ISO standard format, good for precise dating
  • %b %e, %YMonth Day, Year: May 12, 2025Natural language format, easy to read
  • %d/%m/%YDay/Month/Year: 12/05/2025European style date format
  • %b %YMonth Year: May 2025Good for longer timespan projects
  • %B %YFull Month Year: May 2025More formal month representation
  • %A %b %e, %YFull weekday, abbr month, year: Monday May 12, 2025Includes day of week for more context
  • W%V %YWeek no of the year: W20 2025Ideal for week-based project planning

Note: The "auto" option will automatically choose a format based on your timeline scale. For example, it might show just months for long projects or detailed dates for shorter timeframes.

Format Specifiers:
  • %Y - 4-digit year (2025)
  • %m - Month as 2-digit number (05)
  • %d - Day of month as 2-digit number (12)
  • %e - Day of month (12)
  • %b - Abbreviated month name (May)
  • %B - Full month name (December)
  • %a - Abbreviated weekday (Mon)
  • %A - Full weekday name (Monday)
  • %V - Week number (20)
  • %H - Hour (00-23)
  • %M - Minute (00-59)
  • %S - Second (00-59)

Examples

Project Timeline

A standard software development project timeline with phases

Website Redesign

Website redesign project with milestones

Product Launch Schedule

Product launch planning with weekend exclusion

Feedbacks

If you find bugs or would like an improvement, please Send an email.

Support Me

If you find my tools useful, please consider supporting me to help maintain and improve these free utilities.

© 2025 Utility Apps (agi.vinh@gmail.com). All rights reserved.