Skip to content

Use case

The graph layer for the LLM age

Your AI agent generates structured data. TopoKit renders it, hosts it, and gives you a share-able URL — in one round-trip. The graph visualization layer your team plugs into any agentic workflow.

Try a prompt See the API

The workflow end-to-end

  1. 01

    You paste raw data into chat

    CSV, JSON, a log dump, a `git log`, a Jira export, a Notion table — whatever you have. No format conversion needed.

  2. 02

    You tell the agent to render it via TopoKit

    One sentence: "Convert this to TopoKit graph JSON, POST it to https://topokit.io/api/topos, and give me the topokit.io/t/<hash> URL." Templates below.

  3. 03

    The agent calls /api/topos

    It transforms the data into TopoKit JSON (nodes + edges + layout + theme), POSTs the body, receives {"hash":"abc1"}.

  4. 04

    You get a short URL back

    topokit.io/t/abc1 — drop it in Slack, Notion, email, a ticket, a doc, an iframe. The graph renders interactively, with search, pan, zoom, and tooltips.

  5. 05

    Anyone can fork & iterate

    A teammate clicks "Edit / Play around" on the view page, tweaks fields in /play, hits "Generate share link" again — new hash, same workflow, no engineering involved.

Why TopoKit fits the agent stack

One HTTP endpoint

POST JSON → get a short URL. Your agent calls it like any other tool. No SDK, no auth, no setup.

Pure dumb pipe

Whatever JSON you POST is rendered back faithfully on /t/<hash>. The viewer is a thin client around the SDK — no interchange schema to learn.

Live & shareable

The short URL works the moment the request returns. Paste it in Slack, Notion, Linear, GitHub PR descriptions — anywhere a URL renders.

Fork-friendly

Anyone on the receiving end can click "Edit / Play around" to open the topo in /play, tweak fields, and re-share. The team can iterate on the same graph live.

Embed-friendly

Drop the /t/<hash> URL into an iframe and the graph renders inline. Static-site generators, docs platforms, and admin dashboards all accept it.

Hosted forever

Topos persist indefinitely — your AI-generated artifact does not rot. Re-link to it from incident postmortems, decision docs, sprint reviews.

The problem we solve

LLMs spit out structured data

Modern agents already extract entities and relationships from documents, logs, tickets, and codebases. Most of what comes back is a graph — but agents have nowhere to send it that renders.

Pasting raw JSON into chat is useless

Your team isn't going to squint at a 4,000-line nested object in a Slack code block. They want to see the picture.

Custom viz tooling is a tax

Every team that builds an LLM workflow ends up writing a one-off renderer. Mermaid maxes out at a few nodes; force-directed JS libraries take a week of integration work.

Static screenshots break the workflow

You want pan, zoom, search, hover, filter. A PNG is a dead end — interactive exploration is where insights surface.

Prompt templates

Copy/paste these into ChatGPT, Claude, Gemini, Cursor, or any agent that can make HTTP calls.

Workflow A — paste and tweak

Ask the AI for just the data. Pick layout/theme/UI yourself in /play.

recommended for newcomers 
I have this data: [paste your data]. Convert it to TopoKit graph JSON with `nodes` (each with `id` and a `style.label.text`, add `data.type` if useful) and `edges` (each with an `id`, `source`, `target`, and `data` object). Just nodes and edges — I'll pick layout/theme/UI options in the playground myself.

Workflow B — agent does everything

Agent picks visualization options and POSTs for you. One-shot URL.

fully automated 
I have this data: [paste your data]. Convert it to TopoKit graph JSON with `nodes`, `edges`, plus sensible defaults for `layout` (force / hierarchical / dagre / radial / circular / concentric / grid / auto), `theme` (light / dark / corporate / neon / pastel / monochrome / ocean), and the UI flags `search`, `minimap`, `legend`, `toolbar`, `layoutSelector`, `themeSelector`, `infoPanel`, `tooltip`, `contextMenu`, `hoverFocus` (booleans, picked based on graph size and content). Then POST the JSON to https://topokit.io/api/topos and give me the topokit.io/t/<hash> URL. Response is JSON: {"hash":"<short>"} — build the URL as https://topokit.io/t/<hash>.

What your AI agent returns

A single line of plain text — the share URL — and your team has a live, interactive graph:

https://topokit.io/t/abc1 Open a sample →

Click. Pan. Zoom. Search. Hover for tooltips. Right-click for context actions. Share again. Everything the SDK ships in a hosted page no one had to integrate.

API at a glance

POST https://topokit.io/api/topos
Content-Type: application/json
Body: TopoKit JSON config {nodes, edges, layout?, theme?, ...}
Response 201: {"hash":"abc1"}
→ View at https://topokit.io/t/abc1

GET https://topokit.io/api/topos/<hash>
Response 200: the stored JSON

Rate limit: ~30 writes/minute/IP
Size: accepts large payloads (infra ceiling ~100 MB)
Retention: indefinite

Full field reference and SDK-side data format at /docs/data-format.

Ready to plug it into your agent?

Open the playground, paste a TopoKit JSON config, generate a share link. Then plug the same prompt into your agent and watch it return URLs autonomously.

Open the playground Talk to us