usefulweb.site Embeddable Chart Builder

Charts & data

Embeddable Chart Builder

Make a self-contained chart to embed anywhere: inline SVG, standalone HTML, accessible snippet.

First row = headers. First column = labels (or dates/numbers for line and scatter charts); every further numeric column becomes a series.

Max 5 MB; the first sheet is used.

What the chart shows, for screen readers and as the image alt text. Empty: generated from the data.

Shown under the chart, e.g. "Source: Eurostat, 2026".

px

The SVG scales to its container; this sets the aspect ratio and text size.

px

Try an example: Grouped bars with a source line · Interactive donut

How it works

Paste a small table and get a chart you can host yourself: inline SVG markup, a <figure> snippet with an accessible data-table fallback, a standalone .svg file and a standalone .html file with no external scripts (optionally with a tiny inline script for tooltips and keyboard focus).

  • The data is parsed like the CSV/Excel Chart Studio (delimiter, number formats and dates detected automatically) and drawn with the site’s deterministic SVG chart library: Okabe–Ito colours, dash patterns, a <title>/<desc> text alternative and role="img".
  • The SVG is passed through a strict allow-list sanitiser, so the markup contains no scripts, event handlers, external links or style attributes and can be pasted into most CMSs.
  • The <figure> snippet keeps the data accessible: the SVG is labelled by its title and description, the caption carries the source line, and a <details> element holds the full data table as a fallback for screen readers, text browsers and copy-paste.
  • The standalone HTML file contains everything inline (a few lines of CSS; with the interactive option a ~1 KB vanilla script that makes data marks focusable and shows their values). It loads nothing from other servers.

For scripts and AI agents

  • JSON API: POST https://embeddablechartbuilder.usefulweb.site/api/v1/calculate (same calculation as this page)
  • Interface description: OpenAPI 3.1 · AI guide: llms.txt
  • MCP server (Streamable HTTP): https://embeddablechartbuilder.usefulweb.site/mcp · tool name embeddable_chart_builder
Example request
curl -s -X POST https://embeddablechartbuilder.usefulweb.site/api/v1/calculate \
  -H 'content-type: application/json' \
  -d '{"data":"Fruit,2025,2026\nApples,12,15\nPears,9,11\nPlums,4,7","chartType":"bar","title":"Fruit sold (tonnes)","yLabel":"tonnes","sourceNote":"Source: example data"}'

Related tools

  • CSV/Excel Chart Studio – Turn CSV, TSV or Excel data into line, bar, pie, scatter or histogram charts with SVG/PNG export.
Feedback