Shavin MCP

On-spec generation, in your editor.

A native Model Context Protocol server with 20 modular tools that expose your design system directly to AI agents. Token introspection, real-time validation, code autofixing, and full-page layout synthesis — all without leaving your IDE.

Read MCP docsHow SHAVIN.md works with MCP
29 tools, one protocol
AI AgentClaude / Cursor
MCP Server29 tools
Browser DOMLive audit bridge
tokens
components
blocks
guidelines
skills
themes
validate
autofix
audit
synthesize
inspect
bridge
rescan
wait-clean
setup
commands
context
steer
builder-schema
install

The agent queries tools on demand — token manifests, component schemas, live DOM audits — without hallucinating capabilities.

Live Demo

Watch the AI agent and MCP server work in tandem.

The agent queries token manifests and component schemas via MCP, writes the component, then validates it against the design system — all in real time.

AI Assistant
MCP Active
Create a card component using @shavin/ui tokens.
Asking AI assistant...
@shavin/mcp (bg process)
Connect Your Client

One config file. Four supported editors.

Add the Shavin MCP server to your AI assistant's config. Same command, same tools, same token compliance — wherever you write code.

Connect your client

.cursor/mcp.json
{
  "mcpServers": {
    "shavin": {
      "command": "npx",
      "args": ["-y", "@shavin/mcp"]
    }
  }
}
Tool Suite

29 modular tools across seven categories.

Direct agent hooks for token introspection, real-time QA linting, code autofixing, guideline access, and block synthesis.

Tokens
Tokens

Exposes raw tokens.json and 73 WCAG AAA primitive specs directly to AI agents.

get_tokensFoundation, semantic, radius & shadow token scales
get_componentsSpecs for 73 primitive components & CVA variants
get_project_contextLive design system manifest for prompt injection
On-Spec VerifiedJSON-RPC 2.0 Standard
Cognitive Skills

9 specialized AI skills that prevent UI slop.

Pre-packaged cognitive skills stored in .agents/skills/ to enforce mathematical spatial harmony and design token discipline.

shavin-appSaaS & Dashboards

SaaS web applications, analytics dashboards, AI chat consoles, data tables, and forms.

shavin-webpageMarketing & Landing

Landing pages, bento showcases, hero sections, and marketing experiences.

visual-compositorConcentric Geometry

Concentric radius math (R_inner = max(0, R_outer - P)), spatial rhythm, and density laws.

shavin-ui-qa-linterAutomated Design QA

Automated design QA, token linting, accessibility audits, and verification pipelines.

shavin-ui-builderUI Block Sandbox

Isolated UI sandbox workflows for block composition and iterative user approval.

shavin-coreMonorepo Architecture

Housekeeping guidelines, source-of-truth rules, and the 5-layer component pipeline.

npx @shavin/skillsorMCP install_skills tool
Ready when you are

Connect your AI assistant to the design system.

Add one config file and your agent gets 29 tools for zero-hallucination UI generation.

Read MCP docsView on GitHub