A Gantt chart maps every task on a shared calendar timeline, with each bar's left edge on its start date and right edge on its inclusive end date. The Gantt Chart Maker builds that exact timeline in your browser from 2 to 30 task,start,end rows using strict YYYY-MM-DD UTC dates, then exports the visible preview as a standalone SVG file that matches the on-screen chart byte for byte. Canva is a design canvas rather than a project scheduler, so it has no native Gantt chart type or built-in date axis; designers who search for one usually end up manually drawing bars on a blank slide, which is tedious, fragile, and impossible to keep in sync once a single date slips. A purpose-built browser tool removes that friction by handling the date math for you, escaping every label safely for SVG, and producing a portable file you can drop into any document or attach to any project note.
Why Canva Falls Short for Gantt Charts
Canva excels at poster layouts, social graphics, and branded slides, but the catalog of chart types inside a Canva design tops out at bar, line, pie, and a handful of dashboard widgets. None of them produces a horizontal bar that starts on a specific calendar day and ends on a specific calendar day with a continuous date axis underneath. The workaround most teams discover is to drag rectangles onto a blank page, type "Day 1," "Day 2," "Day 3" above each column by hand, and stretch each rectangle to match. That works for a one-week sprint with four tasks; it falls apart the moment a deadline moves, the project crosses a month boundary, or two tasks need to overlap visibly.
The deeper problem is that a Canva file carries no concept of a date. Every bar is a shape with x, y, width, and height. When a stakeholder asks for an updated timeline, you redraw every shape from scratch. There is no way to paste new dates and have the bars recompute themselves, because Canva was never asked to understand them. A Gantt chart is fundamentally a date-to-length mapping, and tools that do not store dates cannot compute that mapping.
A Manual Canva Workaround
If you must stay inside Canva, the cleanest manual route is a table plus a row of rectangles. The workflow has six concrete steps.
- Create a custom Canva design at the aspect ratio of your slide, such as 1920 by 1080 for a deck.
- Add a Canva Table element and fill the first column with task labels, the second with start dates, the third with end dates.
- Place a thin horizontal guide line beneath the table to act as a date axis anchor.
- For each task row, drag a Rectangle element onto the canvas, position its left edge on the guide at a column matching the start date, and stretch its right edge to the column matching the end date. Keep date columns evenly spaced and use Canva's Position panel to lock pixel offsets.
- Lock the rectangles and the table so accidental edits do not move them, then group everything into one element before sharing.
- Export as PNG to share, then re-open the file and repeat every time a date changes.
This works once. It is not a chart. It is a hand-laid mosaic of shapes that the designer must re-lay whenever reality shifts, which is the opposite of what a project timeline is supposed to do.
What the Gantt Chart Maker Does Instead
The Gantt Chart Maker is a single-page browser tool that converts a compact schedule into a standalone SVG timeline. You paste up to 30 rows of task,start,end, optionally add a title, press Generate, and a labeled horizontal bar appears for every accepted task on a shared UTC calendar axis. The output SVG is created from the exact string that powers the preview, so what you see is exactly what downloads. Coordinate calculations are deterministic and rounded only when serialized, which means the same input always produces the same output regardless of which browser tab, device, or operating system you use.
Because the tool is date-native, it handles the awkward cases that trip up manual drawings: a task that ends on the same day it starts still occupies one visible cell; an end date of January 3 on a January 1 start produces three calendar-day cells because dates are inclusive; schedules of 62 days or fewer get daily tick labels, and longer schedules fall back to month ticks so the axis stays readable without losing any accepted task. The interface scrolls horizontally when the output is wider than the preview, so labels never get squeezed into unreadable widths on a phone screen.
Build a Gantt Timeline in Your Browser
- Open the Gantt Chart Maker and type an optional title, up to 100 UTF-16 code units, into the title field.
- Paste your schedule into the input area as one task per line, using the exact form task,start,end. Keep each row on its own line, leave leading and trailing whitespace alone (it is trimmed automatically), and ensure every non-empty row contains exactly two commas so three fields result.
- Confirm every date is a real proleptic Gregorian UTC date in YYYY-MM-DD form, with each inclusive end date on or after its start date. The supported lexical year range is 0000 through 9999, so January 1, 2026 works and so does March 14, 0084.
- Press Generate. The parser checks the 20,000-code-unit raw budget, validates every row, and either renders a labeled timeline with day or month ticks or reports the first malformed row and rejects the whole request.
- Inspect the preview: each bar should sit between the correct tick marks, every label should be readable, and the inclusive span should match what you typed. The exact preview string is what will be downloaded.
- Click Download to save the standalone SVG. The file uses the W3C SVG namespace, ships with viewBox plus an accessible role and label, and opens in any browser, design app, or documentation pipeline.
Schedule Row Format and Hard Limits
CSV-lite is the deliberate trade-off that keeps the input predictable. The tool refuses quoted fields, quoted commas, additional columns, escaped delimiters, and multiline fields. A label that needs a comma must be rewritten without one before use. One malformed row rejects the whole request; the parser never skips it or returns a partial chart, so a typo in row 17 is the difference between a working timeline and an error message. Blank lines are accepted but only after the raw budget is checked, so they cannot be used to pad around the 20,000-code-unit limit.
| Field | Limit |
|---|---|
| Non-empty task rows | 2 to 30 |
| Task label length | 80 UTF-16 code units, exact |
| Optional title length | 100 UTF-16 code units, exact |
| Raw schedule input | 20,000 UTF-16 code units, exact |
| Date format | YYYY-MM-DD, exactly 10 characters |
| Lexical year range | 0000 through 9999 |
| End date rule | Inclusive, on or after start |
| SVG output budget | 100,000 UTF-16 code units, exact |
Exact limits are accepted and one unit over fails with no truncation. If you need more than 30 rows, split the project into phases and chart each phase as its own SVG, then lay the SVGs side by side in your document.
Tick Labels and Inclusive Date Math
Tick labels follow a deterministic rule rather than a dynamic "as many as fit" heuristic. Spans of 62 days or fewer use daily ticks in UTC YYYY-MM-DD form, and the interval expands to keep roughly nine labels while always including the first and last date. A nine-day sprint, for example, may render every day, while a 60-day build phase may render every seventh day. Once the schedule crosses the 62-day boundary, ticks switch to months in YYYY-MM form and a fixed month step is calculated from the full month count. This is deliberate axis sampling rather than task truncation: every accepted task and its complete date width remain in the chart, and the bar geometry is unaffected by which labels appear on the axis.
The worked example for inclusive counting is straightforward: a task from January 1 through January 3 occupies three calendar-day cells because the cells are January 1, January 2, and January 3. A task whose start and end match occupies one visible day cell, so a milestone tagged 2026-05-12,2026-05-12 still renders as a one-day bar. If every task occurs on the same date, the shared domain is one day and every bar remains visible, because the calculation never divides by a zero elapsed span.
Why Output Matches the Preview
The preview string and the downloaded SVG are the same artifact. Generating successfully creates one Blob URL from the complete SVG, which stays alive long enough for an ordinary same-origin anchor download. The Blob URL is revoked when the title or data changes, when a result is replaced, when generation fails, or when the component unmounts, which avoids the immediate-revocation race that breaks downloads in some browsers and prevents accumulated ObjectURL leaks. If Blob or URL creation fails, no stale preview or download is left behind. Wide output scrolls in the preview rather than shrinking labels into an unreadable mobile width.
Every user string is safe SVG text rather than markup. Ampersands, angle brackets, quotes, and apostrophes are converted to XML entities; XML-forbidden controls and isolated surrogates become U+FFFD. Labels appear in text and title tooltip nodes only after this conversion, and the optional title plus the accessible aria-label use the same escaping, so script-looking text remains visible characters rather than an SVG element. Numeric attributes come only from validated finite layout calculations.
When You Still Need Real Project Software
The Gantt Chart Maker describes calendar occupancy and nothing else. It does not parse Microsoft Project files, dependencies, milestones, critical paths, holidays, working calendars, percentage complete, assignees, costs, baselines, or timezone timestamps, and it does not infer whether overlapping work is feasible. If your team needs dependency planning, collaboration, permissions, audit history, or operational commitments, point them at dedicated project-management software and use this tool to draft the high-level timeline for a slide deck, status email, or design document.
Date validation follows ECMAScript's Date Time String Format after strict lexical checks, and the output vocabulary is the W3C SVG 2 specification, which is why the file opens cleanly in browsers, Figma, Illustrator, and most documentation pipelines. For a deeper walkthrough of the same tool with a slightly different angle, see the free no-sign-up timeline guide.