# Timeline chart in Figma

> Bars that span from a start to an end

The timeline family covers Gantt charts, range bars and X-range charts — anything where a bar has both a start and an end rather than growing from a baseline. It is the shape for schedules, availability and durations.

## Available in 3 of 5 chart libraries

| Library | Ready-made examples |
| --- | --- |
| Google Charts | 6 |
| Highcharts | 4 |
| ApexCharts | 3 |

13 examples in total.

These are the real charting libraries running inside the plugin, not redrawn lookalikes. The timeline chart on your canvas is the library's own output, and the Export tab hands developers that same library's configuration plus React, Vue, Angular or Svelte code — so what you design is what gets built.

## Reach for it when

- Project plans, roadmaps, sprint schedules, booking calendars.
- Any measure with a from and a to: shift coverage, uptime windows.

## Use something else when

- Tasks have no meaningful duration; a milestone list is clearer.
- There are dozens of overlapping rows — consider grouping first.

## The data it needs

Per row: a label, a start and an end. Add a category column to group rows.

| Task | Start | End |
| --- | --- | --- |
| Research | 2026-01-05 | 2026-01-19 |
| Design | 2026-01-15 | 2026-02-09 |
| Build | 2026-02-02 | 2026-03-16 |

---

Install Figma Charts: https://www.figma.com/community/plugin/1345221583582136577/figma-charts

All chart types: https://systergon.com/figma-charts/chart-types