Examples · Live table

Live table examples

Some comparisons refuse to become a chart: a licence name, a status, a fee and a caveat all sit in one row. A live table keeps every one of them as text, then makes the table work — click a header to sort, filter by status chips, read money as bars, open the notes, chart a number column in the shape you like — and on a phone it stays a table you scroll sideways, first column pinned.

When to use it

  • Comparisons that mix text, statuses and money in one row — the exact tables a chart cannot hold
  • Buying decisions with fine print: every caveat stays one click away, on the row it belongs to
  • Anything you would otherwise paste as a static table: the live one sorts, filters and folds for phones

Not the right shape?

A single number per row you want to compare at a glance — press the table's "Chart" button or use a lollipop chart; and a trend over time still belongs to a line graph.

Real-world examples

What the platform charges

Money reads as a bar inside its cell, the leading amount stays honest, and the notes column carries what the platform makes you add on top.

Open in maker with this data

View the spec 
{
  "type": "table",
  "theme": "ink",
  "title": "Community platforms, example profile",
  "source": "Pricing pages, August 2026 — leading amounts only",
  "data": {
    "labels": [
      "Skool Pro",
      "Skool Hobby",
      "Circle Professional",
      "Mighty Networks Launch",
      "Discourse Pro",
      "Bettermode Starter"
    ],
    "series": [],
    "columns": [
      {
        "name": "Platform"
      },
      {
        "name": "Charged on this profile",
        "kind": "number",
        "format": "currency:USD"
      },
      {
        "name": "Storefront",
        "kind": "status"
      },
      {
        "name": "Your team still adds",
        "kind": "note"
      }
    ],
    "rows": [
      [
        "Skool Pro",
        201.5,
        "yes",
        "Nothing — processing is inside that rate"
      ],
      [
        "Skool Hobby",
        289,
        "yes",
        "Nothing — processing is inside that rate"
      ],
      [
        "Circle Professional",
        139,
        "yes",
        {
          "text": "The processor's share and its fixed fee",
          "kind": "partial"
        }
      ],
      [
        "Mighty Networks Launch",
        129,
        "yes",
        {
          "text": "Processing, $62.50 to $125 on this profile",
          "kind": "partial"
        }
      ],
      [
        "Discourse Pro",
        100,
        "no",
        {
          "text": "A payment tool and its fees",
          "kind": "partial"
        }
      ],
      [
        "Bettermode Starter",
        399,
        "no",
        {
          "text": "A storefront, on top of a year committed up front",
          "kind": "partial"
        }
      ]
    ]
  }
}

Honest unknowns

Unknown and not-applicable are their own statuses — a question mark says the vendor never published the figure; a dash says the question does not apply.

Open in maker with this data

View the spec 
{
  "type": "table",
  "theme": "mint",
  "title": "AI study tools: the free tier",
  "source": "Product pages, September 2026",
  "data": {
    "labels": [
      "Quizlet",
      "Knowt",
      "Anki",
      "Gizmo"
    ],
    "series": [],
    "columns": [
      {
        "name": "Tool"
      },
      {
        "name": "Free AI plan",
        "kind": "status"
      },
      {
        "name": "Limit published",
        "kind": "status"
      },
      {
        "name": "Works offline",
        "kind": "status"
      }
    ],
    "rows": [
      [
        "Quizlet",
        "yes",
        "yes",
        "no"
      ],
      [
        "Knowt",
        "yes",
        {
          "status": "partial",
          "note": "The cap differs by feature"
        },
        "no"
      ],
      [
        "Anki",
        "na",
        "na",
        "yes"
      ],
      [
        "Gizmo",
        "yes",
        {
          "status": "unknown",
          "note": "Not published"
        },
        "unknown"
      ]
    ]
  }
}
Open this chart in a maker Table maker from scratch

Questions people ask

What is a live table?

A real HTML table — search engines and screen readers read it as one — that also behaves: headers sort, status chips filter, numbers carry a mini-bar, notes expand on click, and narrow screens get one card per row. Nothing is drawn as a picture, so the text stays text.

How is it different from a status matrix or a lollipop chart?

Those are charts of one aspect of a table — statuses, or one numeric column. The live table keeps the whole row together, and its "Chart" button hands any numeric column to the same engine as a lollipop when a picture reads better.