# Waffle chart in Figma

> A grid of squares, one per unit

A waffle chart fills a 10×10 grid so each cell is one percent. Counting squares is slower than reading a bar but far more accurate than judging a pie slice, and the "out of a hundred" framing is unusually easy for a general audience.

## 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 waffle 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

- Communicating a proportion to a non-technical audience — surveys, prevalence.
- You want the denominator to be visible rather than implied.

## Use something else when

- You have many categories; the grid turns into confetti.
- The proportions are tiny — one square is the floor.

## The data it needs

Labels and values; the chart converts them into cells.

| Category | Value |
| --- | --- |
| Alpha | 120 |
| Beta | 80 |
| Gamma | 45 |

---

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

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