Skip to content
plot.tools

Pie chart maker

Show how a total splits into parts. Type the names and the amounts; the percentages are worked out for you.

What this page does

  • Percentages calculated from the values
  • Donut option with the total in the centre
  • Legend with value and share
  • Sort slices by size
  • Warning when there are too many slices
Pie chart: Monthly budget. 5 slices, total $2,900. Largest: Housing, $1,250 (43%).Monthly budgetSample dataHousing$1,250 · 43%Food$620 · 21%Transport$310 · 11%Savings$450 · 16%Leisure$270 · 9.3%43%21%11%16%9%
PNG scale

SVG 1600 × 900 px · PNG 3200 × 1800 px · 16:9

No account and no watermark. The file has the Inter font embedded, named layers and the chart’s alt text, so it looks the same in a slide, a document or a browser. Not every app reads alt text stored in a file, so also paste it into the image’s alt text field.

Alt text: Pie chart: Monthly budget. 5 slices, total $2,900. Largest: Housing, $1,250 (43%).

Your data

First column: labels. Other columns: one series each. The file is read in your browser and is not uploaded.

Table

5 × 1

Label
Remove row

Design

Chart type

Text

Numbers

Colours

Output

Proportion

320 to 4000 px. PNG multiplies it by the scale.

Background
  1. Step 1: Pick a chart typeBar, line, pie, scatter, area or radar. You can switch at any time.
  2. Step 2: Put in your numbersPaste cells from Excel or Google Sheets, load a file, or type in the table.
  3. Step 3: Download the pictureA PNG for slides and documents, or an SVG you can edit.

Start from an example

Click one to load it in the editor, then replace the sample numbers with yours.

Other chart makers

Each page opens the editor on that chart, with a short guide to reading and drawing it well.

Type or paste labels and values and the percentages are worked out for you, in the legend and on the slices. Pie or donut, SVG or PNG, with no account.

How to make a pie chart

  1. List the parts in the first column and their amounts in the second.
  2. Paste the two columns in the Data panel, or type them in the table.
  3. The shares are calculated from the amounts and shown in the legend next to each value.
  4. Choose pie or donut, sort the slices if their order is not meaningful, and download.

What a pie chart can and cannot show

A pie shows how one total divides into parts. It works when there are few parts, when they add up to something meaningful, and when the message is roughly “this part is about half” or “these two together are most of it”. People judge those simple fractions well.

It works badly for comparing parts of similar size, because angles are harder to compare than lengths, and it cannot show change over time. Two pies side by side are harder still. For those cases use a sorted bar chart or stacked bars.

Making the slices readable

  • Start at the top and go clockwise. The first slice begins at 12 o’clock, the position readers expect.
  • Sort by size unless the parts have a natural order, such as age groups or “agree, neutral, disagree”.
  • Keep it to six slices or fewer. Merge the small ones into “Other” in your table.
  • Put the numbers in the legend. Each legend row shows the value and the share, so nobody has to estimate an angle. Percentages are also written on slices of 5% and more.

Colour for slices

Every slice needs its own colour, and neighbours must be easy to tell apart, including for the roughly one in twelve men with a red-green colour-vision deficiency. The default palette was designed for that. The figure shows its colours as they appear with normal vision and with the two red-green deficiencies; the simulation runs in this page’s code.

Donut

The donut option removes the centre and writes the total there. It is the same chart with one more number, useful when the total is part of the message: a budget, a headcount, a number of answers.

Why use Plot Tools

What you can check for yourself, without taking our word for it.

No account, no watermark
The download buttons work straight away. The exported file holds your chart, your text and the font, and nothing else.
Your data stays in the browser
Pasted cells and loaded files are parsed and drawn on this page. There is no upload step, and the site’s security policy only allows connections to itself.
The PNG matches the screen
The Inter font is embedded in the SVG before it is rasterised, so the labels in the PNG sit exactly where you saw them.
Decimal comma understood
1.234,56 and 3,5 are read correctly: the separator and the decimal mark are detected from the data, and you can override both.
Defaults a data editor would accept
Round axis marks, solid fills, one colour per series, bars that start at zero, and a square background that can be transparent.
Colour-blind-safe by default
The default palette is Okabe-Ito. A test in the code simulates red-green colour blindness and checks that its colours stay apart.
A link that carries the chart
“Copy link” packs the data and settings into the part of the address after #, which browsers do not send to servers.
Alt text written for you
A description is generated from the data and stored in the SVG and the PNG. Line and area charts also say how each of the first four series ends compared with its start. It is shown under the chart with a button to copy it.

Questions and answers

Do I have to enter percentages?

No. Enter the amounts. The chart adds them up and shows each slice’s share of the total. If you already have percentages, enter them as numbers and choose the Percent format.

How many slices can a pie chart have?

It draws as many as you enter, but past about six the small slices become hard to compare, and the Design panel shows a warning above eight. Group the small ones into “Other”, or switch to a sorted horizontal bar chart.

What is the difference between a pie and a donut?

A donut is a pie with a hole. The hole makes room for the total in the centre. The slices show the same shares.

What happens to negative values?

A share of a whole cannot be negative, so negative values are drawn as zero. If your data has negatives, a bar chart shows them correctly.

Can a pie chart show two series?

No. A pie shows one whole. If the table has more columns, the pie uses the first one. To compare two wholes, use stacked bars.