Skip to main content
Glama
aryan0078

storykit-mcp

by aryan0078

storykit-mcp

MCP server for the StoryKit asset library — search and embed free, generated design blocks (charts, widgets, illustrations, themes) straight from your editor. Created with love by Story Kit. 🍮

It wraps the free, public StoryKit Asset API as read-only MCP tools. No API key, no account, no on-demand generation — just the thousands of already-generated blocks, embeddable in one line with your own data via data-sk-items.

Tools

Tool

What it does

search_assets

Search by text + kind (CHART_VARIANT, COMPONENT, INTERACTIVE, THEME, …). Returns dataSchema when the asset accepts rows.

get_asset

Full JSON: descriptor, dataSchema, html/css/js (when self-contained), embed snippet, bundle links.

get_embed_snippet

Copy-paste <div data-sk-asset> + sk-embed.js with example data-sk-items.

list_themes

Published themes (palette + vibe).

list_chart_families

43+ Datawrapper-aligned chart families → StoryKit blockTypes.

list_theme_families

Editorial theme palette catalog.

bundle_url

.zip download URL for one or more assets; optional theme id for multi-bundle.

Related MCP server: Datawrapper MCP

Install

It runs with npx — no global install needed.

Claude Code

claude mcp add storykit -- npx -y storykit-mcp

Cursor

.cursor/mcp.json:

{
  "mcpServers": {
    "storykit": { "command": "npx", "args": ["-y", "storykit-mcp"] }
  }
}

opencode

opencode.json:

{
  "mcp": {
    "storykit": { "type": "local", "command": ["npx", "-y", "storykit-mcp"], "enabled": true }
  }
}

Windsurf / generic MCP client

{
  "mcpServers": {
    "storykit": { "command": "npx", "args": ["-y", "storykit-mcp"] }
  }
}

Try it

“Find a StoryKit column chart and embed it with my Q1–Q3 sales numbers.” “Search StoryKit for a stat-row component and give me the embed snippet with data-sk-items.” “List chart families and pick a dumbbell plot skin.”

Examples (curl equivalents)

# Search bar charts
curl -s "https://asset.storykit.space/api/v1/assets?kind=CHART_VARIANT&q=bar&size=5"

# Full asset + dataSchema
curl -s "https://asset.storykit.space/api/v1/assets/1757"

# Chart families catalog
curl -s "https://asset.storykit.space/api/v1/chart-families"

# Multi-bundle with theme
# → https://asset.storykit.space/api/v1/bundle.zip?ids=1757,1760&theme=1756

Embed with your data:

<div data-sk-asset="1757"
     data-sk-items='[{"label":"Q1","value":64},{"label":"Q2","value":41}]'></div>
<script src="https://asset.storykit.space/sk-embed.js" async></script>

Configuration

Env var

Default

Purpose

STORYKIT_API_BASE

https://asset.storykit.space

Override the API origin.

STORYKIT_API_KEY

Optional free key for a higher rate limit (mint one).

Develop

npm install
STORYKIT_API_BASE=http://localhost:8080 npm start

MIT licensed. Built on the Model Context Protocol.

A
license - permissive license
-
quality - not tested
C
maintenance

Maintenance

Maintainers
Response time
Release cycle
Releases (12mo)
Commit activity

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/aryan0078/storykit-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server