CreateLex Figma to SwiftUI MCP

A local MCP (Model Context Protocol) runtime that connects your Figma plugin session to Claude Code, Cursor, Windsurf, or any MCP-compatible AI tool — and writes production-ready SwiftUI directly into your Xcode project.

Generation tiers

Tier 1 — AI-native (zero extra API cost)

Your AI IDE (Claude Code, Cursor, Windsurf, etc.) calls the MCP tools itself:

1. get_swiftui_generation_prompt → returns a ready-to-use system prompt + user message
2. The AI generates SwiftUI using its own model (your existing subscription)
3. write_generated_swiftui_to_xcode → writes the file(s) to Xcode

No CreateLex tokens consumed. No extra API keys required.

Tier 2 — BYOK (Bring Your Own Key)

Set one of these env vars in your MCP client config and generate_swiftui runs locally:

| Env var | Provider | Notes | |---|---|---| | ANTHROPIC_API_KEY | Claude (recommended) | Override model with ANTHROPIC_MODEL | | HF_API_TOKEN | Hugging Face | Default model: Qwen/Qwen2.5-Coder-32B-Instruct, override with HF_MODEL | | OPENAI_API_KEY | OpenAI or compatible | Override model with OPENAI_MODEL (default gpt-4o) | | OPENAI_BASE_URL | Ollama / LM Studio | Set alongside OPENAI_API_KEY=ollama for fully local generation |

Tier 3 — CreateLex hosted (subscription fallback)

If no BYOK keys are set, falls back to the CreateLex hosted pattern matcher. Requires an active CreateLex subscription.

Requirements

• Node.js 18 or later
• Figma desktop app with the Figma to SwiftUI plugin open
• A local Xcode project (optional for Tier 1 prompt-copy workflow)

Install

npx @createlex/figma-swiftui-mcp start --project /path/to/MyApp/MyApp

Or install globally:

npm install -g @createlex/figma-swiftui-mcp
figma-swiftui-mcp start --project /path/to/MyApp/MyApp

MCP client configuration

Add to your Claude Code / Cursor / Windsurf MCP config:

{
  "mcpServers": {
    "figma-swiftui": {
      "command": "npx",
      "args": ["@createlex/figma-swiftui-mcp", "start"],
      "env": {
        "FIGMA_SWIFTUI_PROJECT_PATH": "/path/to/MyApp/MyApp",
        "ANTHROPIC_API_KEY": "sk-ant-..."
      }
    }
  }
}

For Hugging Face BYOK:

{
  "env": {
    "FIGMA_SWIFTUI_PROJECT_PATH": "/path/to/MyApp/MyApp",
    "HF_API_TOKEN": "hf_...",
    "HF_MODEL": "Qwen/Qwen2.5-Coder-32B-Instruct"
  }
}

For fully local generation with Ollama:

{
  "env": {
    "FIGMA_SWIFTUI_PROJECT_PATH": "/path/to/MyApp/MyApp",
    "OPENAI_API_KEY": "ollama",
    "OPENAI_BASE_URL": "http://localhost:11434/v1",
    "OPENAI_MODEL": "llama3"
  }
}

MCP tools

| Tool | Description | |---|---| | get_design_context | Get the full Figma node tree, colors, typography, and layout for a selection | | get_swiftui_generation_prompt | Returns a ready-to-use system prompt + user message — feed to your AI model to generate SwiftUI | | generate_swiftui | Generate SwiftUI via BYOK key or CreateLex hosted (Tier 2/3) | | write_generated_swiftui_to_xcode | Write a generated Swift file (plus optional DesignTokens.swift and component files) to Xcode | | get_project_path / set_project_path | Read or update the target Xcode source directory | | bridge_status | Check if the Figma plugin bridge is connected |

Multi-file output

write_generated_swiftui_to_xcode accepts an additionalFiles array for AI-generated companion files:

{
  "structName": "LoginScreen",
  "code": "import SwiftUI\n...",
  "additionalFiles": [
    { "name": "DesignTokens.swift", "code": "...", "dir": "shared" },
    { "name": "PrimaryButton.swift", "code": "...", "dir": "components" }
  ]
}

Output layout inside your Xcode source folder:

FigmaGenerated/
  Screens/         ← primary view files
  Components/      ← reusable component files
  DesignTokens.swift  ← shared tokens (dir: "shared")
  Manifest/        ← generation metadata

AI-native workflow (Tier 1 example)

In Claude Code or any MCP-connected AI:

1. Select a frame in Figma
2. Ask: "Generate SwiftUI for my selected Figma frame"
3. Claude calls get_swiftui_generation_prompt → generates code → calls write_generated_swiftui_to_xcode
4. File appears in Xcode immediately

Zero CreateLex tokens consumed.

Plugin UI

The plugin's Smart Generate button supports two modes via the dropdown:

• Smart AI — uses your AI IDE or BYOK key for true AI generation
• Classic — uses the hosted pattern matcher (requires subscription)

After generation, the Copy AI Prompt button copies a ready-to-use prompt you can paste into Claude.ai, ChatGPT, or any AI chat. Requires the MCP server to be running.

Login (CreateLex subscription)

Only required for Tier 3 hosted generation:

npx @createlex/figma-swiftui-mcp login

Saves your session to ~/.createlex/auth.json.

Support

• Product: https://createlex.com/figma-swiftui
• Help & billing: https://createlex.com/contact