Dashbook — Dash.fi Brand & Design System

What it is

One hosted MCP endpoint, two tool namespaces. Manual invocation by keyword keeps marketing and product surfaces from leaking into each other.

Remote URL — https://brand.dash.fi/mcp. Zero-install. Works from any client that supports remote MCP URLs.
npm package — @dashfi/mcp-server. A stdio adapter that proxies to the remote URL. Lets Claude Desktop install via npx.
Tool namespaces — product_* (jade brand, components, foundations) and marketing_* (cobalt accent, voice, logos, partners, legal). Plus two shared tools: version and changelog.
Manual invocation — say "use the Dashbook product design system" or "use the Dashbook marketing design system" to scope the agent. The tool descriptions make routing obvious; the agent picks the right namespace.

Install — Claude Desktop

Drop into your config. Restart Claude Desktop. The Dashbook tools appear in the integrations panel.

Via npm package (recommended)

json

// ~/Library/Application Support/Claude/claude_desktop_config.json
//   (macOS — Windows path is in %APPDATA%\\Claude\\)
{
  "mcpServers": {
    "dashbook": {
      "command": "npx",
      "args": ["-y", "@dashfi/mcp-server"]
    }
  }
}

Via remote URL (no install)

json

// Alternative — pure remote (no npm install).
// Claude Desktop 2025.10+ supports remote MCP URLs natively.
{
  "mcpServers": {
    "dashbook": {
      "url": "https://brand.dash.fi/mcp"
    }
  }
}

Install — Claude Code

Add to your project's .mcp.json or your global ~/.claude.json. Pick remote for normal use; pick stdio for offline / local-dev.

Remote (recommended)

json

// .mcp.json in your project root (or ~/.claude.json globally)
{
  "mcpServers": {
    "dashbook": {
      "type": "http",
      "url": "https://brand.dash.fi/mcp"
    }
  }
}

Stdio

json

// Or via the stdio adapter (for offline / local development):
{
  "mcpServers": {
    "dashbook": {
      "command": "npx",
      "args": ["-y", "@dashfi/mcp-server"]
    }
  }
}

Install — anything else MCP-aware

Point the client at the remote URL. The endpoint speaks Streamable HTTP (the modern MCP transport) and falls back to SSE for older clients.

bash

# Sanity-check the remote endpoint with curl:
curl -sS -X POST https://brand.dash.fi/mcp \
  -H 'Content-Type: application/json' \
  -H 'Accept: application/json, text/event-stream' \
  -d '{"jsonrpc":"2.0","id":1,"method":"initialize","params":{
        "protocolVersion":"2024-11-05",
        "capabilities":{},
        "clientInfo":{"name":"curl","version":"0"}}}'

# Expect an SSE-style "data: {…serverInfo…}" line back.

Add as a connector

claude.ai and Claude Code both support adding a remote MCP server as a first-class connector, no plugin required.

Claude Code CLI

bash

# Claude Code — add as a connector
claude mcp add --transport http dashbook https://brand.dash.fi/mcp

claude.ai (individual — Pro/Max)

Customize → Connectors → "+" → Add custom connector → paste https://brand.dash.fi/mcp.

claude.ai (Team/Enterprise)

An owner configures it once at Organization settings → Connectors → Add → Custom → Web; members then connect it from Customize → Connectors.

Discovery surfaces

bash

# Machine-readable discovery surfaces
https://brand.dash.fi/llms.txt                 # llms.txt index
https://brand.dash.fi/.well-known/ai-catalog.json  # ARD manifest

ARD-aware agent clients can also discover this endpoint automatically from /.well-known/ai-catalog.json — no manual connector setup needed.

Tools

22 tools total. Prefix tells you the namespace at a glance.

product

product_list_components Catalogue of all components by category + status.

product_get_component Full anatomy for one component — dimensions, tokens, variants, props, porting.

product_get_foundation Color / typography / spacing / radius / motion / shadows foundation data.

product_get_token Resolve a single token to its hex (light + dark).

product_search Fuzzy search across all components.

product_port_to Stack-specific porting checklist for a component.

product_get_logo Wordmark / app icon SVG — thin proxy over marketing_get_logo for product-namespace discovery.

product_get_page_template Composed auth-page scaffold — chrome, layout, copy tokens, required components.

marketing

marketing_list_patterns Catalogue of reusable dash.fi marketing page patterns.

marketing_get_pattern Full recipe for one marketing pattern — DOM sketch, tokens, gotchas, props.

marketing_get_foundation Marketing tokens / typography / layout / section / motion foundation data.

marketing_get_brand_voice Tone / sentence-case / numerics rules.

marketing_get_logo Wordmark + app icon SVG. Returns both URL and inline content.

marketing_list_logo_presets Available colorway presets for wordmark + app icon.

marketing_list_card_variants Catalogue of Dash.fi credit-card art variants.

marketing_get_card_art One Mastercard MDES asset slot for one card variant.

marketing_get_marketing_palette Cobalt-based marketing palette.

marketing_get_legal_disclosure FDIC / partner-bank / card-issuer disclosure text.

marketing_get_partner_kit Partner co-branding rules.

marketing_search Search marketing assets + guidance.

shared

version MCP server + docs site version.

changelog Recent design-system changes.

Resources

MCP resources for clients that browse a catalogue instead of calling a tool — resources/list + resources/read. Same underlying data as the matching tools.

dashbook://components Component catalogue — mirrors product_list_components.

dashbook://components/{slug} One component's full anatomy — mirrors product_get_component.

dashbook://foundations/{slug} One product foundation — mirrors product_get_foundation.

Using it

Once installed, invoke manually. The MCP doesn't auto-activate — that's intentional, gives you control over product vs marketing context.

text

# Manual invocation — the design system has two namespaces.

"Use the Dashbook product design system. Build a settings page with a
work-email input, a save button, and an avatar."

"Use the Dashbook marketing design system. Draft a launch announcement
email with the partner-bank disclosure."

# Or call tools directly by name:

"Call product_get_component slug=button — what variants does it have?"

"Call product_port_to slug=input stack=react — give me the React snippet."

What it returns

Structured JSON, not prose. Agents can parse the dimensions / tokens / variants / props fields directly. Same data the docs site renders.

Components — every value visible in /components/<name>'s Anatomy tab is a typed field on the spec. Dimensions, tokens (per-part, per-mode hex), variants, sizes, composition rules, non-features, props, porting checklist, canonical Svelte example.
Foundations — color (product + base + marketing palettes), typography (font families + license notes), spacing scale, radius scale, motion durations, shadow scale.
Marketing — brand voice rules, legal disclosure text, and logo SVGs returned both as URL and inline content (same bytes either way; pick whichever fits the surface you're building). Partner-kit endpoint still returns URLs only — per-partner asset bundles are Phase 2.

Source of truth

The MCP reads from the same typed spec modules the docs site renders from. One source, two consumers.

Component specs — src/lib/specs/components/<slug>.ts (one per component, all 60).
Schema — src/lib/specs/types.ts.
Tokens — src/lib/tokens.ts (colors, radii, shadows, motion).
MCP wiring — src/lib/mcp/server.ts + tools/{product,marketing,shared}.ts + resources.ts (dashbook:// resources) + schemas.ts (output schemas).
Endpoint — src/routes/mcp/+server.ts (origin validation in src/lib/mcp/origin.ts).

Coming soon

Remaining backlog — see PLAN.md for the full list.

Per-partner asset bundles (lockup SVG, partner logo) in marketing_get_partner_kit — asset URLs still pending Partner Operations.
Auth gating for partner-specific assets (FDIC partner data, exec bios, etc.). Public surfaces stay public.