How to Make a Pie or Donut Chart From Pasted Numbers

How do you turn pasted numbers into a pie chart?

Custom PRD build turns a pasted list of labels and a matching list of values into a titled pie or donut chart and downloads it as SVG or PNG — no sign-up, no spreadsheet, no charting library. The chart renders as inline SVG in your browser and updates on every keystroke.

The whole loop is five steps: open Custom PRD build, paste your labels into the left panel, paste the values underneath, type a chart title, then choose pie or donut and hit download. The split layout keeps the controls on the left and a sticky preview on the right, so you never scroll to check a change — paste, glance, download.

The page opens with a worked example so you can see the expected shape: labels Chrome, Safari, Edge, Firefox against values 65, 18, 10, 7. Those four numbers add up to 100, so the percentage labels land on exactly 65%, 18%, 10% and 7%. Overwrite both boxes with your own data and the same structure applies — one label per line, one number per line, in matching order.

Paste labels and values that parse cleanly

Both boxes accept one entry per line or comma-separated values, so a column lifted straight out of a spreadsheet usually drops in without editing. Labels are trimmed and blank lines ignored. Values must be plain numbers: negatives and anything non-numeric are rejected, while zeros are allowed. If the number of labels and the number of values disagree, the tool warns you instead of silently pairing the wrong name with the wrong slice.

The most common failure we see is the two-column paste. Copying a label column and a value column together puts both into one box, and the pairing collapses; paste labels first, then values, and glance at the legend to confirm each colour swatch sits next to the name you expect. The second trap is punctuation inside numbers — commas double as the list separator, so a value typed as 1,240 is ambiguous. Enter 1240 and check the slice size against what you know it should be.

There is a hard cap of 40 slices. If your data runs longer, group the small categories into a single "Other" slice first. As a rule of thumb, don't count on readers comparing more than a handful of slices accurately, so 40 is a safety limit, not a target.

Pie or donut, and what the toggles change

A segmented toggle switches between a solid pie and a donut whose inner hole is 55% of the radius; the outer diameter stays the same, so only the middle changes. The donut usually sits better beside a headline or a total on a slide because the hole gives the eye somewhere to rest, while a plain pie reads more like a classic report exhibit.

Show percentages is on by default. Turning it off leaves labels only in the slices, but the legend always carries the raw value, so the underlying number is never lost. Percentages are computed from the sum of what you pasted rather than assumed to total 100 — paste counts totalling 4,382 and the slices still show each category's share of that total.

The title field takes up to 80 characters and is optional; leave it blank for a bare chart that inherits its headline from the slide. One edge case worth knowing: if every value is zero the preview shows an empty state instead of dividing by zero, so a blank chart almost always means the paste went wrong rather than the tool breaking.

Exporting SVG or PNG for slides and reports

Two download buttons sit directly under the preview. SVG is written as a serialized standalone file — vector, resolution-independent, and openable in Illustrator, Figma, or Inkscape, and it stays crisp at any print size because the geometry, not the pixels, is stored (see the W3C SVG 2 specification). PNG is rasterized onto a canvas at 2× the preview's pixel size, which is sharp on a typical slide but fixed once exported.

Pick by destination. SVG for print, PDF, decks you will still edit, or anything going into a codebase. PNG for chat, email, CMS uploads, and the many systems that quietly strip vector files. Copy SVG code puts the same markup on your clipboard, which is the fastest route when you want the chart inline in an HTML document rather than as a separate attachment.

Because PNG resolution follows the preview, it follows your window: if you need a larger PNG, widen the browser window before downloading rather than upscaling the exported file afterwards. And whatever title, legend, and percentages you see is exactly what ships — there is no second editing pass after the download.

Privacy, limits, and when a pie chart is wrong

Nothing is uploaded. The chart is drawn in the page and both file exports are generated locally, so pasting an internal revenue split or a client's category breakdown never sends those numbers to a server. The trade-off is that there is no account, no history, and no saved projects — close the tab without downloading and the chart is gone.

The tool is deliberately narrow: no CSV file import, one data series, a fixed slate-indigo slice palette with no colour picker, no 3D or exploded slices, and the 40-slice cap. If you need grouped bars, trend lines, or brand colours baked into the chart, this is not the right instrument — browse the other free online tools or, for deck accents, pull a matching set from the Color Palette Generator From One Color.

Pie charts encode value as angle and area, which readers judge less precisely than length, so use them for part-of-a-whole stories with a few slices and a total that matters; for ranking categories, a bar chart will always be fairer. Two checks before publishing: confirm the total, since every percentage is derived from it, and keep percentage labels on, because a legend that distinguishes slices by colour alone is a known accessibility failure under WCAG 2.2.

References

• W3C Scalable Vector Graphics (SVG) 2 specification
• W3C Web Content Accessibility Guidelines (WCAG) 2.2