Doughnut Chart Maker — Free CSV Donut & Ring Charts
Doughnut chart from CSV — perfect for KPI slides with a hollow centre. PNG export, no upload.
How to use
- 1 Paste two-column CSV — label and value.
- 2 Toggle the legend to fit your design.
- 3 Download the doughnut as PNG.
Why use this tool
- Doughnut layout — same data as pie but with a clearer centre for KPI overlay in slides.
- Chart.js loaded on demand.
- Quoted CSV cells supported.
- Pure client-side — your data stays on your device.
Frequently asked questions
Difference from a pie chart?
Visually a ring instead of a filled circle. The data and computation are identical — see the <a class="underline" href="/pie-chart-maker">Pie Chart Maker</a>.
Can I put a label in the middle?
Download the PNG and overlay your KPI in your slide tool — keeps this tool dependency-free.
Why no per-slice legend value?
Hover the slices in the live preview to see the value — the PNG export keeps it clean by default.
What is Doughnut Chart Maker?
A Doughnut Chart Maker is a tool that generates a doughnut chart from CSV data in the browser. It renders proportional segments around a ring with a hollow centre, a layout suited to KPI displays. The chart can be exported as a PNG image, and all processing runs client-side with no file upload.
Features
CSV-driven doughnut rendering
Reads the first row as headers and the first two columns as label/value pairs, drawing one ring segment per data row with Chart.js's doughnut chart type.
Automatic slice coloring
Each row is assigned a color from a fixed 10-hue palette (cycled by row index) with a white 1px border between segments, so charts stay legible without manual color picking.
One-click PNG export
Download button calls canvas.toDataURL('image/png') on the rendered chart and triggers a browser download named doughnut-chart-maker.png — the exported image reflects exactly what is on screen, including the legend toggle state.
Client-side only, quoted CSV supported
Chart.js is imported dynamically in the browser and the CSV parser handles RFC 4180 quoting (quoted fields, embedded commas, escaped quotes); the pasted data never leaves the device — there is no upload or server-side processing.
Example
Input
Source,Users
Organic,420
Direct,310
Referral,180
Social,140
Email,90
Output
doughnut-chart-maker.png — canvas-resolution PNG (matches the on-screen preview element size), 5 colored ring segments sized proportionally to 420/310/180/140/90, white 1px segment borders, legend shown above the chart if the 'Show legend' toggle is on
Common use cases
-
1
KPI slides with a ring for center-label overlay
Export a doughnut PNG of a metric breakdown (e.g. traffic source share) and overlay a headline number in the hollow center inside a slide editor, since the tool itself does not render center text.
-
2
Quick visualization of categorical proportions
Paste a two-column CSV of category and value (e.g. survey answer counts, budget line items) to instantly see proportional share as ring segments without opening a spreadsheet app.
-
3
Reusing spreadsheet exports without reformatting
Paste CSV rows copied directly from Excel or Google Sheets, including quoted fields with embedded commas, since the built-in RFC 4180 parser handles quoting and delimiter detection automatically.
Doughnut Chart Maker renders a Chart.js 4 doughnut chart from pasted two-column CSV data (label, value), using the first column as slice labels and the second as values, with one segment colored per row from a fixed 10-color palette. CSV is parsed client-side with an RFC 4180-compliant parser, Chart.js is lazy-loaded on demand, and the finished chart is exported as a PNG via the canvas's toDataURL method — no data is uploaded to a server.
- Category
- Creator
- Pricing
- Free
- Privacy
- Browser-based
- Signup
- Not required
References
Privacy
Your data never leaves your browser unless explicitly stated. Doughnut Chart Maker runs entirely client-side — no server upload, no logging, no tracking of your input.
Related tools
YouTube Thumbnail Downloader
Download YouTube thumbnails in all available resolutions. Just paste a video URL.
Open toolOpen Graph Preview
Test how your URL appears when shared on social media. Preview Facebook, Twitter, LinkedIn, and Slack cards.
Open toolWord & Character Counter
Count words, characters, sentences, and paragraphs. Reading time, speaking time, and top keywords — instant.
Open toolLorem Ipsum Generator
Generate Lorem Ipsum placeholder text — by paragraphs, sentences, or words. Optional HTML wrapping.
Open toolBuild, share, and grow on Zerethon Social
Free signup. Earn points, collect achievements, and connect with creators worldwide.