# Icicle chart in Figma

> A hierarchy as stacked horizontal bands

An icicle chart is a sunburst unrolled into a rectangle: each level is a row, each node a band sized by value. Because it is rectilinear, labels fit — which makes it the readable choice when your node names matter.

## Available in 1 of 5 chart libraries

| Library | Ready-made examples |
| --- | --- |
| D3 · Nivo | 1 |

1 examples in total.

These are the real charting libraries running inside the plugin, not redrawn lookalikes. The icicle 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

- Hierarchies where every node needs a legible label.
- File trees, category paths, call stacks.

## Use something else when

- You need the compactness of a circle in a square frame.
- The tree is very wide; bands become slivers.

## The data it needs

Parent, child and value per row.

| Parent | Child | Value |
| --- | --- | --- |
|   | Engineering |   |
| Engineering | Platform | 240 |
| Engineering | Product | 180 |

---

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

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