Beautiful charts. Just a URL.

Create beautiful SVG charts and embed them in your README, Markdown docs, or anywhere images work. No setup, no signup.

Edit any value in the URL to update the chart.

Check the URL parameters and try again.

[![Chart](https://x-cmd.com/draw?type=bar&t=evil&title=Commits+by+day&labels=Mon%2CTue%2CWed%2CThu%2CFri%2CSat%2CSun&series=dev%3A12%2C18%2C9%2C15%2C21%2C8%2C17&series=ci%3A8%2C11%2C6%2C13%2C16%2C5%2C12)](https://x-cmd.com/draw/explore?type=bar&t=evil&title=Commits+by+day&labels=Mon%2CTue%2CWed%2CThu%2CFri%2CSat%2CSun&series=dev%3A12%2C18%2C9%2C15%2C21%2C8%2C17&series=ci%3A8%2C11%2C6%2C13%2C16%2C5%2C12)

11 chart typesData in the URLApache-2.0 · Open source

Try it with your data.

Edit the data. Copy the embed code.

Chart generated from the fields on the left

[![Chart](https://x-cmd.com/draw?type=bar&t=evil&title=Commits+by+day&labels=Mon%2CTue%2CWed%2CThu%2CFri%2CSat%2CSun&series=dev%3A12%2C18%2C9%2C15%2C21%2C8%2C17&series=ci%3A8%2C11%2C6%2C13%2C16%2C5%2C12)](https://x-cmd.com/draw/explore?type=bar&t=evil&title=Commits+by+day&labels=Mon%2CTue%2CWed%2CThu%2CFri%2CSat%2CSun&series=dev%3A12%2C18%2C9%2C15%2C21%2C8%2C17&series=ci%3A8%2C11%2C6%2C13%2C16%2C5%2C12)

Chart gallery

Eleven ways to show your data. Pick one to make it yours.

Browse all chart types Architecture & mind maps — more than charts

Donut & piepie

Grouped & stacked barsbar

Edit your data.

Work in a table, paste a CSV, or bring your JSON. The preview and URL update as you edit.

Table, CSV, and JSON
Hover to inspect values
A link you can share and embed

Open the editor

Chart styles

Change the t= parameter to switch styles. Light and dark schemes are supported.

Roundedt=evil

Monochromet=market-mono

Progresst=progress

URL, npm, or Deno.

Use a URL, or render locally with the same parameters.

Docs

<a href="https://x-cmd.com/draw/explore?type=pie&amp;labels=TS%2CPy%2CGo&amp;values=48%2C23%2C9">
  <img src="https://x-cmd.com/draw?type=pie&amp;labels=TS%2CPy%2CGo&amp;values=48%2C23%2C9" alt="Chart">
</a>

Open a URL, use an <img>, or paste it into Markdown. Pass complex data as JSON with ?d=.

npm install @x-cmd/draw

import { draw } from '@x-cmd/draw';
const { svg } = draw({ type: 'pie', labels: 'A,B', values: '3,2' });

# Save an SVG with the CLI
npx x-draw --type pie --labels "TS,Py" --values "48,23" --out pie.svg

Render synchronously in your app, scripts, or CI. No network request needed.

import { draw } from "jsr:@x-cmd/draw";

const { svg } = draw({ type: "pie", labels: "A,B", values: "3,2" });

Import the renderer from JSR. No runtime permissions needed.

Data travels with the chart.

Each SVG includes its data and parameters as JSON in <metadata>. Read it back, change it, or render it again.

Plain text. Easy to track.

SVG fits into git alongside your code. Review changes without comparing screenshots.

Prefer to host it yourself?

Deploy to your own Cloudflare account. GET chart rendering works out of the box.

Deploy to Cloudflare