Design intelligence for AI-generated UI — principles, patterns, content, brand, design tokens.
Most payments and commerce work still happens through a UI a human drives. Raven MCP server moves it into the conversation instead. Design intelligence for AI-generated UI — principles, patterns, content, brand, design tokens.
Raven is an MCP server for coding agents. Click any element in the app you have running locally and say what should change — Raven sends the agent the selector, the computed styles, and your design tokens — then audits the result for contrast, tap targets, and typography.
Because this one is hosted, setup is mostly authentication — you point your client at the endpoint and approve access. Nothing runs on your machine, so there is no runtime to keep patched.
The server publishes 14 tools. What each one is for:
get_principles — Get design principles relevant to a UI contextget_pattern — Get proven patterns for a specific UI typeget_business_strategy — Get business/monetization strategiesevaluate_design — Evaluate a design description against principles. Pass base64 PNG screenshots (before_screenshot/after_screenshot) for a structured before/aftersearch_knowledge — Search across all principles, patterns, and strategiesget_checklist — Get a pre-publish checklist for a UI typeget_d4d_framework — Get Design for Delight framework templateslist_design_systems — Browse available design systemsget_design_system — Get tokens for a specific design systemcompose_system — Mix tokens from different systemsget_brand_system — Get a full system styled like a well-known brandaudit_page — Audit HTML/CSS against Raven's quality standards — pass html for static audit, or url to render headless with optional scroll_settle (step throughConfiguration is passed through the environment: FIGMA_TOKEN. Treat anything key-shaped as a real credential — scope it to the minimum the server needs, and rotate it if it ever lands in a shared config.
Plenty of payments and commerce servers cover similar ground. The differences that matter in practice are scope of access and how much setup stands between you and a working tool call. Raven's toolset — get_principles, get_pattern, get_business_strategy and 11 more — is a fair guide to whether it matches your workflow. It is maintained by ai.ravenmcp; worth a glance at recent repository activity before you build anything load-bearing on it.
SyncDev reviews every entry in this directory against the project's own documentation before publishing, and revisits them as servers change.
| Tool | What it does |
|---|---|
| get_principles | Get design principles relevant to a UI context |
| get_pattern | Get proven patterns for a specific UI type |
| get_business_strategy | Get business/monetization strategies |
| evaluate_design | Evaluate a design description against principles. Pass base64 PNG screenshots (before_screenshot/after_screenshot) for a structured before/after pixel diff with fix_confirmed, changed_ratio, and changed region. Pass comp |
| search_knowledge | Search across all principles, patterns, and strategies |
| get_checklist | Get a pre-publish checklist for a UI type |
| get_d4d_framework | Get Design for Delight framework templates |
| list_design_systems | Browse available design systems |
| get_design_system | Get tokens for a specific design system |
| compose_system | Mix tokens from different systems |
| get_brand_system | Get a full system styled like a well-known brand |
| audit_page | Audit HTML/CSS against Raven's quality standards — pass html for static audit, or url to render headless with optional scroll_settle (step through reveal gates, then return to top) and viewport parameters; containerMaxWi |
| score_page | Return a per-category (0–10) design score for a page — typography, accessibility, spacing, color, responsive layout, design tokens, structure — derived from the same checks as audit_page, plus the overall score/grade, th |
| audit_layout | Evaluate visual rhythm, alignment, and optical balance; detects orphan-stretch (a lonely last-row grid/flex card stretching far wider than siblings) |
{
"mcpServers": {
"raven": {
"command": "npx",
"args": ["-y", "raven-mcp"],
"env": {
"FIGMA_TOKEN": "your-value"
}
}
}
}Add to claude_desktop_config.json, then restart Claude Desktop.
| Variable | Description | Required |
|---|---|---|
| FIGMA_TOKEN | Credential the server authenticates with. | Yes |
Payments infrastructure meets AI — customers, invoices, subscriptions and current API docs from Stripe's server.
Build for Shopify with current APIs — the official Dev MCP server for schema-accurate storefront and admin code.
Give your AI assistant a supervised window into your Interactive Brokers account — balances, positions, live quotes and orders.
Invoices, payments and disputes through PayPal's official server — commerce operations by conversation.
Enables querying and listing Azure resources and costs directly from an MCP client.
Empowers LLMs with Bitcoin Lightning Network payment capabilities via the ZBD API.