# Gauge chart in Figma

> One value against a scale, as a dial

A gauge shows a single value on an arc, usually with coloured zones for good and bad. It spends a lot of space on one number, which is why dashboards that use them tend to fit less on screen — but as a hero figure in a Figma mock, that is exactly the point.

## Available in 3 of 5 chart libraries

| Library | Ready-made examples |
| --- | --- |
| Google Charts | 5 |
| Highcharts | 5 |
| ECharts | 12 |

22 examples in total.

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

- A hero metric in a dashboard design where the scale and threshold matter.
- The audience is used to dials — speed, utilisation, capacity, health scores.

## Use something else when

- You have several metrics to show; bullets stack far better.
- There is no meaningful maximum — a gauge needs a full scale to mean anything.

## The data it needs

A single value, plus the minimum and maximum of the scale.

| Label | Value | Min | Max |
| --- | --- | --- | --- |
| Utilisation | 68 | 0 | 100 |

---

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

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