🍱 Lunchbox Hands

Chart Maker

Paste CSV or JSON and download a bar, line, pie, doughnut, or scatter chart as a PNG

Paste a few rows of CSV or JSON and get a chart you can drop into a README, a doc, or a slide β€” bar, line, pie, doughnut, or scatter, downloaded as a PNG at 1Γ— or 2Γ—. The first column becomes the labels and every numeric column becomes a series, so a copy-paste out of a spreadsheet usually just works; formatted values like $1,234 and 45% are read as numbers, and anything unreadable becomes a gap with a warning instead of an error. Series use the colorblind-safe Okabe–Ito palette. This is deliberately a quick-chart tool, not a spreadsheet or a BI dashboard: there are no formulas, pivots, or saved dashboards. Need to reshape the data first? Use CSV ↔ JSON or JSON to CSV. For matching brand colors, try the Color Palette Generator, and for a quick filler graphic the Placeholder Image Generator. Everything runs locally in your browser β€” your data is never uploaded.

Drop a .csv or .json file here or click to upload β€” or just paste below
Chart type

1Γ— exports 800Γ—450 px; 2Γ— exports 1600Γ—900 px with larger, still-sharp text β€” good for retina screens and slides.

Frequently asked questions

Does my data leave my browser?

No. The CSV or JSON you paste is parsed in your browser, the chart is drawn on a canvas in your browser, and the PNG is generated from that canvas. Nothing is uploaded to a server, there is no account, and closing the tab discards everything.

What data formats can I paste?

CSV, TSV, and semicolon-delimited text, with or without a header row (the first column is used as the labels and every other column becomes a series). Also JSON: an array of objects, an object map like {"Jan": 10, "Feb": 12}, an object of arrays like {"Sales": [1,2,3]}, a plain array of numbers, and the Chart.js {labels, datasets} shape. Values such as $1,234 and 45% are read as 1234 and 45, and cells that are not numbers become gaps with a warning rather than an error.

Why is there no SVG or PDF export?

The chart is drawn with Chart.js, which renders to an HTML canvas β€” a bitmap. There is no vector geometry to export, so only PNG is offered. If you need a vector chart for print, export at 2x and place the PNG, or use a vector charting tool instead.

What resolution is the PNG?

Exactly the width and height you set (default 800x450) at 1x, and double that at 2x. The 2x export is a genuine re-render at twice the pixel density, so text and lines stay sharp instead of being an upscaled blur. Use 2x for retina screens, slide decks, and anywhere the image may be zoomed.

Why do pie charts only show one of my columns?

A pie or doughnut chart divides a single total into slices, so it can only show one set of values. If your data has more than one numeric column the first one is charted and a warning tells you which. Switch to bar or line to compare several series at once.

Are the colors colorblind-safe?

Yes. The default series colors are the Okabe-Ito palette, chosen so the hues stay distinguishable under the common forms of red-green and blue-yellow color vision deficiency, with two extra colorblind-safe colors for charts with more than eight series. Charts with more than ten series start reusing colors, so add direct labels if that happens.

Get weekly dev tools and tips