Dew Design System

Dew MCP

AI · No MCP
◆ NOTIFICATIONS ◆
Email alerts
Push notifications
AI · With Dew MCP
Notifications
Email alerts
Push notifications
Dew × MCP
Dew × AI · MCPFor product teams

Make AI-generated UIs Dew-native by default.

Dew MCP is an integration layer that gives AI builders full awareness of Dew’s components, tokens, and usage rules. When your AI tool generates UI, it assembles from Dew — not ad-hoc HTML/CSS — so teams ship consistent, accessible product UI from the first prompt.

Add Dew MCP to your client

Drop this into your MCP config (Claude Desktop, Cursor, or any MCP-compatible client).

"dew-mcp": {
  "type": "http",
  "url": "https://dew-mcp.freshworks.com/mcp"
}
What MCP provides5 surfaces

Everything an AI needs to build with Dew.

Not just a component list. MCP exposes the full context an AI needs to make correct decisions — which component, which variant, which token, which pattern.

Component inventory + metadata

Components, variants, states, props, and constraints — everything that exists in Dew.

Usage guidance

When to use what, do/don't rules, and accessibility expectations for every component.

Token awareness

Token-driven styling and theming guidance — never magic numbers.

Composition rules

How components combine — inputs + validation, banners + actions, and the patterns in between.

Extensibility

As Dew grows, MCP updates automatically surface new components to AI builders.

Why it mattersfor product teams

AI speed, without the design-system tax.

The usual trade-off with AI-generated UI is consistency — fast drafts, slow cleanup. MCP removes the cleanup step.

Consistency at scale

AI output matches Dew from the first render — no post-hoc cleanup to force-fit it into the system.

Faster adoption

Product teams get Dew-compliant UI even in early prototypes, so the design-system conversation starts from a good baseline.

Reduced rework

Less “design-system refactoring” after AI-generated drafts. Fewer handoffs between the AI and a human trying to normalize its output.

Built-in quality

Accessibility and interaction semantics align with Dew standards by default, not as a late-stage QA pass.

Where MCP plugs inclients

Connect once. Every AI tool gets Dew.

Dew MCP speaks the Model Context Protocol, so any MCP-compatible client can consume it without custom integration.

Figma Make

Generate production-ready UI from Figma frames using Dew components, tokens, and composition rules.

Claude / Claude Code

Ask Claude to build a feature and it will assemble from Dew’s component catalog — not reinvent primitives.

Custom AI builders

Any MCP-compatible client can connect and start producing Dew-native output with no extra prompt plumbing.

When Dew is missing a piecefallback

Gaps route back into the agentic pipeline.

If MCP encounters a component or pattern Dew doesn't cover, it flags the gap. The gap becomes a request into the Dew Agentic Setup — so the next time any team hits it, Dew ships a real component instead of one-off UI.

MCP gap detected
  ↓
Figma → spec → build → stories → VQA → ship
  ↓
New Dew component available

Start building with Dew.

Browse the component catalog, or see how the Dew team keeps the system itself moving fast.