Free animated charts. Make one in 30 seconds, embed it anywhere.

One JSON spec in, a living chart out — nine chart types, five themes, light and dark. Open source, MIT, no signup, nothing uploaded.

  • MIT
  • No signup
  • Nothing uploaded
Make a chart Embed in code

02 · YOUR DATA

Paste your numbers. Watch it draw.

One row per line: a label, a comma, a number. The chart redraws as you type, right here.

Want the full set of controls — themes, titles, PNG and SVG export? The chart maker covers every type, and the graph maker sticks to the four classic shapes.

03 · TAKE IT ANYWHERE

Embed, PNG, SVG, or a link.

Embed

One script tag, then a <live-chart> holding your spec. It animates on the page the same way it does here.

<script type="module" src="https://meikucharts.com/v1/live-chart.js"></script>

PNG

Download the exact frame at 1920×1080 for an article, 1200×630 for a social card, or 1080×1080 for a square.

SVG

The same scene, serialized as vector. Scales to any size, drops into a slide deck or a print layout.

Copy link

Your data rides inside the link itself. Nothing is stored on a server, because there is no server.

04 · FOR DEVELOPERS

A JavaScript chart library that morphs.

Three steps to a living chart, and the same spec works when an agent writes it for you.

  1. Load the engine

    <script type="module" src="https://meikucharts.com/v1/live-chart.js"></script>

  2. Describe the chart

    <live-chart>
  <script type="application/json">
    {
      "type": "column",
      "theme": "editorial",
      "title": "Weekly Signups",
      "source": "Product analytics",
      "data": {
        "labels": [
          "Mon",
          "Tue",
          "Wed",
          "Thu",
          "Fri"
        ],
        "series": [
          {
            "name": "Signups",
            "values": [
              12,
              19,
              14,
              27,
              22
            ]
          }
        ]
      }
    }
  </script>
</live-chart>

  3. Change it, and it morphs

    const chart = document.querySelector("live-chart");
chart.spec = {
  "type": "line",
  "theme": "mint",
  "title": "Weekly Signups",
  "source": "Product analytics",
  "data": {
    "labels": [
      "Mon",
      "Tue",
      "Wed",
      "Thu",
      "Fri"
    ],
    "series": [
      {
        "name": "Signups",
        "values": [
          18,
          24,
          20,
          33,
          29
        ]
      }
    ]
  }
};

05 · AI · MCP

Ask an AI for a chart.

Meiku Charts ships an MCP server, so an assistant can build, suggest and render charts without you opening a maker at all. Point your client at the built server and the four tools appear.

"Chart last week's signups as columns, mint theme."

render_chart → a finished PNG or SVG, straight into the conversation

Claude Desktop config

{
  "mcpServers": {
    "meikucharts": {
      "command": "node",
      "args": ["/path/to/apps/mcp/dist/index.js"]
    }
  }
}

The four tools

  • create_chart spec → embed snippet
  • suggest_chart raw numbers → the right chart type
  • list_themes 10 theme/variant pairs
  • render_chart spec → PNG or SVG, straight into the chat

Prefer plain HTTP? POST /render answers with a PNG or an SVG — the same engine, self-hosted with Docker.

Runs on your machine today; hosted API comes later.

06 · WHY

Small, honest, and yours.

Everything runs in the browser. Your numbers stay on your machine — there is nothing to sign up for and nothing to upload.

9

chart types

One engine draws every one of them, and morphs between them.

5

themes

Editorial, glass, ink, mint and neon, each in light and dark.

17 KB

gzipped

The whole renderer, in one file, with no build step to reach it.

0

dependencies

Nothing to audit, nothing to keep patched, nothing to break.

MIT

license

Use it at work, ship it in a product, no attribution chore.

A11y

built in

Arrow keys walk every mark; a hidden table carries the real numbers.