🥧 Pie Chart Maker: Build a Pie Chart Online and Download SVG

By ToolNimba Editorial Team · Updated 2026-06-23

Chart data

Add a label and value for each slice.

	Label	Value

Chart title

This pie chart maker turns a simple list of labels and values into a clean, labelled pie chart in seconds. Type each category and its number, and the tool instantly calculates every slice as a share of the total, draws it in a distinct color, and lists the label, value and percentage in the legend. When the chart looks right you can download it as a scalable SVG that stays sharp at any size. Everything happens in your browser, so your data is never uploaded.

What is the Pie Chart Maker?

A pie chart shows how parts add up to a whole. Each slice represents one category, and the size of the slice is proportional to that category's share of the total. This maker does the proportional math for you: it sums every value you enter, divides each value by that total, and converts the resulting fraction into an angle that sweeps around the circle. Because the full circle is 360 degrees, a category worth a quarter of the total fills a 90 degree wedge, and one worth half fills 180 degrees.

The drawing itself uses standard SVG arc geometry. The chart has a center point and a radius, and each slice is built by walking around the circle one category at a time. For a slice, the tool computes the start and end angle, finds the x and y coordinates of those two points with cosine and sine, and draws a path from the center out to the first point, along the arc to the second point, and back to the center. When a single slice is larger than half the circle, a large-arc flag tells the renderer to take the long way around so the wedge fills correctly. The result is true vector art, not a bitmap, which is why the download stays crisp on a 4K monitor or a printed poster.

Colors come from a fixed eight color palette chosen to stay distinct next to each other. If you have more than eight slices the palette repeats, which is a useful nudge that very large pie charts are hard to read. Each slice also carries a small percentage label when it is wide enough to fit one, and a tooltip with the exact value appears on hover. The legend mirrors the chart so you can read the numbers precisely even when two slices look similar in size.

Pie charts work best for a handful of categories that genuinely sum to a meaningful whole, such as a budget, a market split, survey responses, or how you spend a day. For comparing many items or showing change over time a bar chart or line chart is usually clearer. This tool keeps the focus tight: enter your data, read the shares, and export a chart you can drop into a slide, report or web page.

When to use it

Visualising a monthly budget so each spending category shows as a share of total income.
Turning survey or poll results into a quick percentage breakdown for a report or slide.
Showing market share, traffic sources or sales by product as proportions of the whole.
Building a teaching example or homework figure that needs a clean, downloadable chart.

How to use the Pie Chart Maker

Edit the four starter rows or add your own categories, typing a label and a number in each row.
Watch the pie chart, percentages and legend update instantly as you type, with one color per slice.
Use Add row for more categories or the small x to remove a row you do not need.
Give the chart a title, then click Download SVG to save a sharp, scalable image of your chart.

Formula & method

For each category, percentage = value / total * 100, where total is the sum of all values. The slice angle in radians = value / total * 2 * PI. To draw a slice the tool finds the arc endpoints with x = cx + r * cos(angle) and y = cy + r * sin(angle), where (cx, cy) is the center and r is the radius, then sets the SVG large-arc flag to 1 whenever a slice spans more than 180 degrees (PI radians). Slices are laid out clockwise starting from the top of the circle.

Worked examples

A monthly budget of Housing 1200, Food 600, Transport 300 and Savings 400.

Add the values to find the total: 1200 + 600 + 300 + 400 = 2500.
Housing share = 1200 / 2500 = 0.48, which is 48 percent and a 0.48 * 360 = 172.8 degree slice.
Food share = 600 / 2500 = 0.24, which is 24 percent and an 86.4 degree slice.
Transport share = 300 / 2500 = 0.12 (12 percent), Savings share = 400 / 2500 = 0.16 (16 percent).

Result: Slices of 48, 24, 12 and 16 percent that add up to 100 percent of the 2500 total.

Survey responses: Yes 45, No 30, Not sure 25.

Total responses = 45 + 30 + 25 = 100.
Yes = 45 / 100 = 45 percent, a 162 degree slice (45 percent of 360).
No = 30 / 100 = 30 percent, a 108 degree slice.
Not sure = 25 / 100 = 25 percent, a 90 degree slice, exactly a quarter of the circle.

Result: A three slice pie reading 45 percent Yes, 30 percent No and 25 percent Not sure.

How a percentage share maps to a pie slice angle

Share of total	Percentage	Slice angle (degrees)	Over half the circle?
1 of 10	10%	36	No
1 of 4	25%	90	No
1 of 3	33.3%	120	No
1 of 2	50%	180	No (exactly half)
2 of 3	66.7%	240	Yes, large arc
9 of 10	90%	324	Yes, large arc

When a pie chart fits, and when another chart is better

Situation	Best chart	Why
Parts of one whole, few categories	Pie chart	Shares of a total are easy to read as slices
Comparing many items precisely	Bar chart	Bar length is easier to compare than slice area
Change over time	Line chart	A trend reads better as a connected line
Categories that do not sum to a whole	Bar chart	A pie implies the parts make 100 percent

Common mistakes to avoid

Using too many slices. A pie chart becomes hard to read past about six categories, because thin slices look alike and labels crowd together. Group small categories into an Other slice, or switch to a bar chart when you have many items.
Plotting values that do not form a whole. A pie chart implies every slice is part of one total that sums to 100 percent. Putting unrelated numbers, or values from different time periods, into a pie is misleading. Use it only when the parts genuinely add up to a meaningful whole.
Comparing slices across two separate pies. It is very hard to judge whether a slice in one pie is bigger than a slice in another, because the eye compares angles poorly. If you need to compare groups side by side, a grouped bar chart is far clearer.
Leaving out the actual numbers. Percentages alone can hide the scale: 50 percent of 4 responses is very different from 50 percent of 4000. Keep the raw values in the legend, which this tool does, so readers see both the share and the count.

Glossary

Slice: One wedge of the pie that represents a single category, sized in proportion to its value.
Total: The sum of every value you enter. Each slice is that value divided by the total.
Percentage: A category's value expressed as a share of the total out of 100, equal to value divided by total times 100.
Radius: The distance from the center of the pie to its outer edge, which sets how large the chart is drawn.
Arc: The curved outer edge of a slice, drawn between its start and end angle around the circle.
SVG: Scalable Vector Graphics, an image format made of math described shapes that stay sharp at any size.

Frequently asked questions

How do I make a pie chart with this tool?

Type a label and a number for each category in the rows provided. The chart, percentages and color legend update instantly as you type. Use Add row for more categories, then click Download SVG to save the finished chart. There is nothing to install and no sign up.

How is each slice percentage calculated?

The tool adds up every value you enter to get a total, then divides each value by that total and multiplies by 100. So a category of 400 in a total of 2500 is 400 / 2500 * 100 = 16 percent, which becomes a slice covering 16 percent of the circle, or about 57.6 degrees.

Can I download the chart?

Yes. Click Download SVG to save the chart as a scalable vector file. Because it is vector based, the image stays perfectly crisp whether you place it in a tiny slide thumbnail or blow it up to a printed poster. The file name is taken from your chart title.

What happens if I enter zero or leave a value blank?

Rows with a blank, zero or negative value are simply skipped, so they do not draw an empty slice or break the math. If every value is empty, the tool shows a placeholder circle and asks you to enter at least one positive number.

Is there a limit on the number of slices?

There is no hard limit, but the built in palette has eight distinct colors and repeats after that. In practice a pie chart is clearest with about three to six slices, so consider grouping small categories into an Other slice if you have many.

Is my data private?

Yes. The entire tool runs in your browser with plain JavaScript, so your labels and values are never sent to a server. Your most recent chart is saved locally on your own device so it is still there when you return, and you can clear it any time with the Reset button.