Dew MCP Server

AI-powered Model Context Protocol server for Dew Design System. Expose component documentation to AI agents with integrated Figma and Playwright automation.

Quick Setup Explore Tools
🤖

AI-Powered Components

Expose your component library to AI agents for intelligent code generation and assistance.

🎨

Figma Integration

Connect design files to component implementation for seamless design-to-code workflows.

🎭

Playwright Automation

Browser automation for testing, validation, and comprehensive component workflows.

Available MCP Tools

Powerful tools for AI agents to interact with your component library

Quick Setup

Get started with Dew MCP in minutes

NPM

Installation

Add to your project

# Install the MCP server
pnpm add @freshworks/dew-mcp-server

# Or with npm
npm install @freshworks/dew-mcp-server

# Or with yarn
yarn add @freshworks/dew-mcp-server
IDE

Cursor IDE Setup

Configure MCP in Cursor settings

{
  "mcpServers": {
    "dew-mcp-server": {
      "command": "npx",
      "args": ["-y", "@freshworks/dew-mcp-server"]
    }
  }
}
JS

Custom Configuration

Advanced setup with custom tools

import { createMCPServer } from '@freshworks/dew-mcp-server';

const config = {
  name: 'My Component Library MCP',
  version: '1.0.0',
  packageName: '@myorg/ui-components',
  enableFigma: true,
  enablePlaywright: true,
  analytics: {
    enabled: false,
  },
};

await createMCPServer(config);

API Reference

Complete configuration options and tool definitions

Usage Examples

Real-world scenarios and integration patterns