Build Apple Style
UI UX Design
with an MCP

Start building for €9.99/mo
Without MCP
UI without Apple UI MCP
With MCP
UI with Apple UI MCP

Works with your favorite AI tools

Claude
Gemini
Codex
VS Code
Cursor
Windsurf

Three powerful tools

Everything you need to build beautiful interfaces

Review Design

Analyze your codebase. Get scores, issues, and actionable recommendations.

Generate Component

Create Apple-styled components for React, SwiftUI, React Native, Tailwind, or CSS. 30+

Style Guide

Access Guidelines for colors, typography, spacing, animations, and more.

How it works

Get started in three simple steps

1

Configure it

Add Apple UI MCP to Claude Desktop, Cursor, or any MCP-compatible tool with your API key.

2

Ask for components

Simply ask: "Generate an Apple-style button in React" or "Review my form for HIG compliance."

3

Get production-ready code

Receive complete code with styles, usage examples, accessibility notes, and design tokens.

Simple pricing

One plan, everything included

€9.99
per month
  • Review Tool
  • Generate Tool
  • Guide Tool
  • 30+ component types
  • Multiple platform outputs (React, SwiftUI, etc.)

Cancel anytime.

Documentation

Set up Apple UI MCP with your favorite AI coding tool. Click on any card to view official MCP documentation.

Claude Code

Docs

~/.claude.json

{
  "mcpServers": {
    "appleuimcp": {
      "type": "http",
      "url": "https://appleuimcp.com/mcp",
      "headers": {
        "Authorization": "Bearer YOUR_API_KEY"
      }
    }
  }
}

Cursor

Docs

~/.cursor/mcp.json

{
  "mcpServers": {
    "appleuimcp": {
      "url": "https://appleuimcp.com/mcp",
      "headers": {
        "Authorization": "Bearer YOUR_API_KEY"
      }
    }
  }
}

VS Code

Docs

.vscode/mcp.json

{
  "servers": {
    "appleuimcp": {
      "type": "http",
      "url": "https://appleuimcp.com/mcp",
      "headers": {
        "Authorization": "Bearer YOUR_API_KEY"
      }
    }
  }
}

Windsurf

Docs

~/.codeium/windsurf/mcp_config.json

{
  "mcpServers": {
    "appleuimcp": {
      "serverUrl": "https://appleuimcp.com/mcp",
      "headers": {
        "Authorization": "Bearer YOUR_API_KEY"
      }
    }
  }
}

Gemini CLI

Docs

~/.gemini/settings.json

{
  "mcpServers": {
    "appleuimcp": {
      "httpUrl": "https://appleuimcp.com/mcp",
      "headers": {
        "Authorization": "Bearer YOUR_API_KEY"
      }
    }
  }
}

OpenAI Codex

Docs

~/.codex/config.toml

[mcp_servers.appleuimcp]
type = "http"
url = "https://appleuimcp.com/mcp"

[mcp_servers.appleuimcp.headers]
Authorization = "Bearer YOUR_API_KEY"

Quick Setup

1

Get your API key

Subscribe and get your key from the dashboard.

2

Add configuration

Copy the config for your tool and replace YOUR_API_KEY.

3

Restart your tool

Restart your AI coding tool to load the MCP server.

Troubleshooting

?MCP server not showing up

Make sure you've saved the config file in the correct location and restarted your tool. Check that JSON syntax is valid (no trailing commas).

?Authentication errors (401)

Verify your API key is correct and hasn't expired. Keys start with aum_. Generate a new key from the dashboard if needed.

?Connection timeouts

Check your internet connection. If behind a firewall or proxy, ensure appleuimcp.com is allowed.

?Tools not appearing in chat

Some tools require you to enable MCP in settings. In Cursor, go to Settings → Features → MCP. In VS Code, ensure you're using agent mode.