Lorem Chartsum.

Placeholder chart images for developers.

Playground → How it works

areadark /800/400?type=area&style=dark

barclean /800/400?type=bar&style=clean

lineblueprint /800/400?type=line&style=blueprint

donutminimal /800/400?type=donut&style=minimal

piepastel /800/400?type=pie&style=pastel

areapastel /800/400?type=area&style=pastel

How it works

1
Build a URL Set dimensions, chart type, and style in the path and query string. Every combination is valid.
2
Drop it in your code Use it as an <img src>, CSS background, Markdown image, or anywhere a URL works.
3
Same URL, same chart — always A seeded RNG guarantees identical output for any given URL. Cache-friendly and CDN-ready.

Playground

Tweak parameters, copy exactly what you need.

Dimensions

Width Height

Chart

Type Style Series Points

Options

Title optional Seed

Grid lines Legend

Snippets

Ready to paste in any context.

<!-- Chart placeholder image -->
<img
  src="https://lorem-chartsum-api.noah-weidig.workers.dev/800/400?type=area&style=dark&seed=docs"
  alt="Chart placeholder"
  width="800"
  height="400"
/>

/* Background image in CSS */
.hero {
  background-image: url('https://lorem-chartsum-api.noah-weidig.workers.dev/1200/630?type=area&style=dark&seed=hero');
  background-size: cover;
}

function ChartPlaceholder({ width = 800, height = 400, type = 'area', seed = 'placeholder' }) {
  const src = 'https://lorem-chartsum-api.noah-weidig.workers.dev/' + width + '/' + height + '?type=' + type + '&seed=' + seed;
  return <img src={src} alt="Chart placeholder" width={width} height={height} />;
}

<!-- README chart placeholder -->
![Monthly sales](https://lorem-chartsum-api.noah-weidig.workers.dev/800/400?type=bar&style=clean&seed=readme)

API reference

A URL is the entire interface.


            https://lorem-chartsum-api.noah-weidig.workers.dev/:width/:height?params

Path

Segment	Range	Description
`:width`	32–4000	Output width in pixels
`:height`	32–3000	Output height in pixels

Query parameters

Parameter	Default	Values	Description
`type`	`bar`	bar · line · pie · area · donut · treemap · scatter · histogram · boxplot · density · heatmap · bubble	Chart type
`style`	`minimal`	minimal · clean · dark · pastel · blueprint	Color palette & theme
`series`	`3`	1–7	Number of data series
`points`	`8`	2–60	Data points per series
`seed`	hash(url)	any string	Deterministic seed — same seed = same chart
`title`	—	any string	Chart title rendered at top
`grid`	`true`	true · false	Show or hide grid lines
`legend`	`true`	true · false	Show or hide series legend

Response

Header	Value
`Content-Type`	`image/svg+xml`
`Cache-Control`	`public, max-age=31536000, immutable`
`ETag`	Hash of SVG content for conditional requests