Under the hood

The MCP server the plugin is built on.

Point any MCP client at @tmorrow/cre8-mcp directly and it gains 15 tools spanning lookup, agent-authored UI trees, and UI that streams live — no fine-tuning, no stale context.

Component lookup

list_components

Enumerate every component with its category and summary.

get_component

Pull the full spec for one component — props, slots, events, usage rules.

search_components

Find the right building blocks by name, description, or category.

get_patterns

Approved composition patterns — login forms, data tables, page layouts.

get_composition

How a component actually nests, from the library's own stories — not a guessed naming rule.

generate_code

Turn a component tree into ready-to-render web component or React markup.

A2UI — agent-authored UI trees

get_a2ui_catalog

The full JSON-Schema catalog: every component, typed props, enum constraints, slots, events.

validate_a2ui_spec

Validates a component tree against the catalog before it ships — not after.

get_content_model

Whether a component takes content through children or slots — never both.

cre8_guide

The briefing on emitting UI that validates first try, and the traps that cost attempts.

Live UI surfaces — streamed, not generated-and-done

ui_open_surface

Opens a live surface and returns a URL a human can watch update in place.

ui_stream

Streams a change into an open surface — the only mutation tool.

ui_get_surface

Returns a surface's current tree and data model, with bindings resolved.

ui_events

Reads what the user did — events fired by components you bound handlers to.

ui_close_surface

Closes a surface. Also swept automatically after an hour of inactivity.

your client

Works in Claude Code, Cursor, Windsurf, VS Code, Gemini CLI, OpenCode, Codex CLI, and any other Model Context Protocol host.

~/.config · mcp.json

// Connect any MCP client to the Cre8 design system
{
  "mcpServers": {
    "cre8": {
      "command": "npx",
      "args": ["-y", "@tmorrow/cre8-mcp"]
    }
  }
}

agent output · generate_code("stat row")

<cre8-grid>
  <cre8-grid-item>
    <cre8-feature heading="Requests" description="1.2M this month"></cre8-feature>
  </cre8-grid-item>
</cre8-grid>  // ← real components, accessible, on-brand