🎩 You're Invited:Meet the Socket team at Black Hat in Las Vegas, August 3-6.RSVP
Sign In

@slickfast/mcp

Package Overview
Dependencies
Maintainers
1
Versions
24
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@slickfast/mcp

SlickFast — render 47 chart & info-design types (bar, line, pie, KPI, cards, funnel, matrix, gauge, calendar…) plus multi-chart dashboards tiled into one image, as SVG/PNG via MCP. Local and deterministic; nothing leaves your machine.

latest
Source
npmnpm
Version
0.7.14
Version published
Maintainers
1
Created
Source

SlickFast — charts & dashboards for AI agents

npm version npm downloads license MCP

SlickFast is a pure rendering primitive: JSON spec → SVG → PNG in milliseconds. No browser, no Puppeteer, no heavy dependencies. Deterministic by design — same spec, same image, every time.

Most chart-to-image tools secretly spin up a full headless browser — hundreds of MB, slow cold starts, flaky screenshots. SlickFast renders pure in-memory: no Chromium, no GPU, no DOM, no randomness, no drift. That one decision is why it's fast enough for agents, cheap enough to cache by spec-hash, and reproducible enough to test against.

47 chart and information-design types (bar, line, pie, KPI, cards, funnel, gauge, heatmap, calendar, gantt, waterfall…), plus entire multi-chart dashboards tiled into one image in a single call. It runs as an MCP tool, so an agent hands it a spec and gets back a finished PNG (or SVG) — 100% local, nothing leaves your machine.

⚡ This image is LIVE — SlickFast rendering its own real project stats right now, updated automatically by a cron. The same one-URL trick works in your README:

SlickFast live pulse — real project stats, updating automatically

render_chart({ type: "bar", data: { labels: ["Q1","Q2","Q3"], series: [{ values: [12,19,8] }] } })
  → a retina PNG, rendered on your machine

See it

One tool call, JSON in, image out — and the token math that makes it agent-native:

SlickFast is agent-ready: 45 tokens per chart vs 280–2,400 for code, 47 types, deterministic

More at slickfast.com/#gallery — every image there is engine output.

Why agents (and the people paying for their tokens) pick SlickFast

  • Tokens are the real cost — a spec is nearly free. An agent hand-writing SVG or matplotlib code burns hundreds to thousands of output tokens, then often retries when it doesn't render. A SlickFast spec is a few dozen tokens, and {type, data} alone is a finished, well-designed chart. A whole dashboard is one tool call, not ten renders and layout math.
  • Changes are one-field edits. Swap barline, change a palette, resize for a slide: edit one key, re-render. The agent never rewrites code or reasons about a diff — which is what makes iteration with a human ("make it dark, bigger title") actually cheap.
  • No headless browser. Most chart-to-image pipelines secretly spawn Puppeteer or Playwright — hundreds of MB, slow cold starts, flaky output. SlickFast renders pure in-memory, milliseconds per chart.
  • Native SVG, vector-first. Output is a few KB of crisp-at-any-scale SVG (or retina PNG on demand) — small enough to cache, embed, or ship anywhere.
  • Deterministic — same spec, same chart, every time. No randomness, no timestamps, no browser drift. Cacheable, testable, reproducible; zero flaky pixel diffs. Almost no charting tool can promise this — and it's exactly what a tool-calling agent needs.
  • Never throws garbage at the model. Empty data, a bad tile, a filtered-to-nothing series → a clean, graceful frame, not a crash or a stack trace. A real mistake (unknown palette, bad enum) → a loud error listing the valid options, so the agent self-corrects in one step.
  • 100% local & private. Rendered and rasterized on your machine. Nothing is sent anywhere.

Tools

  • render_chart(spec) → the chart as a PNG image (default) or SVG (format: "svg"). For a dashboard, pass type: "dashboard" with tiles: [{ chart, span }] — each tile is a full spec of any other type, composited into one image in a single render.
  • describe_type(type) → the exact data shape, a minimal working spec, and per-type gotchas. Call it first when you're unsure how to structure a type.
  • gallery() → a curated demo gallery of example charts and dashboards — each as a rendered image plus its spec. Just ask "show me a demo" or "what can you make?". gallery({board:"comparison"}) tiles a whole family into one image; board:"all" shows every type across 6 boards.
  • list_palettes() → every valid palette name, grouped into flat palettes and nested themes, with their colors. Ask "what palettes are available?".
  • share_chart(spec, name?) → turn a chart into a public, embeddable URL — for a README, email, Slack, or a live auto-updating chart (push new data, every embed updates). Ask to "share this chart" or "make this a live chart." The one tool that talks to the hosted API (free key at slickfast.com); everything else is 100% local. The returned URL contains no key — safe to paste anywhere.
  • report_issue(summary, spec?)"report this bug." Formats a bug report and returns a prefilled GitHub-issue link and email link you click to send — SlickFast sends nothing itself.

Install

Everything renders locally and privately for free. When you want a public URL for a README, email, or Slack — or a live auto-updating chart — there's a hosted API with a generous free tier (no card required).

One-click: Add to Cursor Install in VS Code

Or add to your MCP config and restart — it runs locally via npx, no clone or build needed:

{ "mcpServers": { "slickfast": { "command": "npx", "args": ["-y", "@slickfast/mcp"] } } }
  • Claude Desktopclaude_desktop_config.json (Settings → Developer → Edit Config; macOS: ~/Library/Application Support/Claude/)
  • Claude Code — one command: claude mcp add slickfast -- npx -y @slickfast/mcp
  • Cursor — Settings → MCP → Add new server, or the same JSON in ~/.cursor/mcp.json
  • claude.ai — connector settings

Try this first (after restarting):

"Show me what SlickFast can do" — renders the gallery, live in your chat.

Then: "build a dashboard with an MRR tile, a signups funnel, and a usage heatmap."

Two ready-made starter prompts (Try SlickFast and Build a dashboard) also appear in clients that surface MCP prompts — one click, no typing.

Not seeing it? Restart the app after editing the config (MCP servers load at startup) · needs Node 18+ (node -v) · first npx run downloads once, then it's instant · one stray comma breaks the JSON. Still stuck → open an issue.

Seeing your charts (the reliable way to display them)

Rendering is always local — nothing leaves your machine. This section is purely about which surface displays the result. render_chart returns two ways, and they differ a lot:

  • format:"svg" → the reliable inline path. Returns SVG text. In a chat surface that supports artifacts (claude.ai, Claude Desktop), the agent creates an artifact containing that SVG and presents it — that's the display step; the SVG string in the tool result is not user-visible on its own. Ask for a chart and Claude does this — no config, no gymnastics.
  • format:"png" (default) → a base64 image block. It only paints where the client renders MCP image blocks, which is inconsistent across surfaces — many chat UIs, and every coding/terminal view, don't. Don't depend on it for inline display.

Other ways to get the picture:

  • Share/embed anywhere (Slack, email, a webpage) → the hosted API returns a public …/chart.png?spec=… URL that renders everywhere, independent of any MCP client.
  • Local stdio install (the MCP shares your disk) → pass outputPath to write the PNG/SVG to disk and open the file. In a hosted/sandboxed MCP the process is filesystem-isolated (a saved file is invisible to you) — use the SVG-artifact path instead.

If you asked for a chart and see nothing: it rendered (the agent can read you the values) — it's a display-surface gap, not a bug. Have the agent re-render with format:"svg" into an artifact, or view it in a claude.ai / Claude Desktop chat. If the tool is missing or erroring entirely, that's a connection problem — restart so the MCP server reconnects.

Sharing a chart as a URL (hosted API)

Rendering is fully local and needs no network. When you want a chart other people can see — embedded in a README, an email, Slack — ask to "share this chart": the share_chart tool publishes it to the hosted API and returns a permanent public URL (no key inside, safe to paste anywhere). It's a live chart: push new data to the same name and every embed updates by itself — that's what powers the live dashboard at the top of this page. The agent offers this only when you ask to share or publish — rendering stays local and private otherwise. Needs a free API key (250 renders/mo, no card) at slickfast.com, set as SLICKFAST_API_KEY in the MCP config.

License

AGPL-3.0-only. Free to use, self-host, and embed under the AGPL's terms (your friends running it locally are completely unaffected). Building it into a closed-source product or a hosted service? That needs the AGPL'd source opened — or a commercial license from us instead: simple per-app licenses from $99/year, no license keys — slickfast.com/license.html or licensing@slickfast.com.

Feedback, bugs & feature requests

  • GitHub: SlickFast/slickfast — bug reports and feature requests via the issue templates.
  • Email: feedback@slickfast.com
  • Or ask your agent to "report this as a SlickFast issue" — the report_issue tool drafts the report (with the repro spec) for you. Nothing is ever sent automatically.

Developing locally

Clone the repo, then from the package directory:

cd apps/mcp
npm install
node test-client.mjs   # spawns the server, calls render_chart, checks the output

To point an MCP client at a local checkout instead of the published package, use "command": "node", "args": ["<path-to-clone>/apps/mcp/server.mjs"].

Keywords

mcp

FAQs

Package last updated on 03 Aug 2026

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts