UXKIN Agent SDK

Give your AI agent real design

Search UI references and structured design materials from the UXKIN library, right inside Claude, Cursor or any MCP client.

How it works

UXKIN pairs an agent skill with a remote MCP server. The no-ui-slop skill sets how your agent approaches UI work, and the server gives it its tools: find_ui_references and find_ui_materials to search, get_journey to open a whole flow, and list_collections / get_collection to use the references you saved. One setup prompt works for Claude Code, Codex, Cursor and any MCP client that connects over HTTP.

  1. 01Connect

    Copy the setup prompt from the Agent SDK tab and paste it into your agent. It installs the no-ui-slop and uxkin-research skills and adds https://uxkin.com/mcp with Authorization: Bearer your-token. Keep the token in your agent's local settings or an environment variable. Never put it in code you commit, a link, a screenshot or a log. If it ever leaks, reset it and the old one stops working. Or skip the token: apps that support MCP sign-in, like Claude and Claude Code, can add https://uxkin.com/mcp on its own. The app opens a UXKIN page, you click Allow, and it's connected. Disconnect it any time from your account.

  2. 02Understand

    Before changing any UI, the agent reads what's already there: the components, shared styles and the screens around the change. It works out the one thing the person using the screen is trying to do, and keeps good existing work. For a new web project with no design yet, it can suggest up to three Web references for you to choose from. Your pick becomes the project's DESIGN.md; an existing one is never replaced without asking.

  3. 03Reference

    When a real example can settle a specific decision, like how to lay out a checkout or an empty state, find_ui_references searches real apps, screens, journeys and websites. One or two strong matches beat a long list. References guide decisions; they aren't templates to copy.

  4. 04Materials

    When the design needs a concrete piece it doesn't have yet, find_ui_materials returns colors, typography, components and DESIGN.md content from real web design systems. The agent works from one consistent set of choices instead of inventing new ones for every screen, and it never stacks a second set of rules on top of your existing design system.

  5. 05Build

    The agent builds something that feels made for this product, with the main task obvious and easy. Your requirements, your existing design system, accessibility, platform conventions and anything you ask for directly always come first.

  6. 06Review

    Once the UI runs, the agent looks at the real result, not just the code. It fixes broken layouts, regressions, contrast and focus problems, anything private showing on screen, and anything that gets in the way of the main task. It checks what people will actually see.

Use UXKIN in the Claude app

For Claude on the web, desktop or phone. No token: you sign in to UXKIN once.

  1. 1

    Open UXKIN in Claude's connector directory.

    Add UXKIN to Claude ↗
  2. 2

    Click Connect, log in to UXKIN and click Allow.

  3. 3

    Ask Claude for real UI references while you design, like “find onboarding screens for a meditation app”.

Add it by address instead

In Claude, open Customize → Connectors, click Add custom connector, name it UXKIN and paste this address:

https://uxkin.com/mcp

Add it once and it works wherever you use Claude with that account. Searching needs a UXKIN plan, and you can disconnect Claude any time from your account page.

Use UXKIN in Claude Code

No token: you sign in to UXKIN once, and it works in all your projects.

  1. 1

    In a terminal, add UXKIN:

    claude mcp add --scope user --transport http uxkin https://uxkin.com/mcp
  2. 2

    Start Claude Code (claude), type /mcp, pick uxkin and choose Authenticate. A UXKIN page opens in your browser: log in if asked and click Allow.

  3. 3

    Recommended: add the free UXKIN skills (no-ui-slop and uxkin-research), so Claude Code knows when to look things up.

    npx skills add https://uxkin.com --skill no-ui-slop uxkin-research -g -a claude-code -y
  4. 4

    /mcp now shows uxkin connected. Ask for real UI references while you build, like “find onboarding screens for a meditation app”.

Searching needs a UXKIN plan. You can disconnect Claude Code any time from your account page.

Use UXKIN in Cursor

No token: you sign in to UXKIN once. Needs the Cursor desktop app.

  1. 1

    Click the button. Cursor opens with UXKIN filled in: click Install.

    Add to CursorDon't have Cursor?
  2. 2

    In Cursor's MCP list, click Login (or Needs authentication) next to uxkin.

  3. 3

    Log in to UXKIN in the browser and click Allow. When your browser asks to open Cursor, click Open. That's Cursor taking you back, and it's normal.

  4. 4

    uxkin turns green with 5 tools. Ask the agent for real UI references while you build, like “find onboarding screens for a meditation app”.

Searching needs a UXKIN plan. You can disconnect Cursor any time from your account page.

Use UXKIN in Codex

No token: you sign in to UXKIN once.

  1. 1

    In a terminal, add UXKIN:

    codex mcp add uxkin --url https://uxkin.com/mcp
  2. 2

    Then sign in. A UXKIN page opens in your browser: log in if asked and click Allow.

    codex mcp login uxkin
  3. 3

    Start Codex and type /mcp: uxkin is listed with its tools. The sign-in is kept, so you only do this once.

Searching needs a UXKIN plan. You can disconnect Codex any time from your account page.Or install the UXKIN plugin for Codex instead: the same connection plus the free UXKIN skills, in one go.
codex plugin marketplace add uxkin/agent
codex plugin add uxkin@uxkin
codex mcp login uxkin

Use UXKIN with GitHub Copilot

In VS Code, with Copilot Chat. No token: you sign in to UXKIN once.

  1. 1

    Click the button. VS Code opens with UXKIN filled in: click Install.

    Add to VS CodeDon't have VS Code?

    Nothing happened? Open VS Code once after installing it, then click again, or use Add it by hand below.

  2. 2

    When the server starts, VS Code asks to let uxkin sign in: click Allow. Log in to UXKIN in the browser and click Allow again, then let the browser open VS Code.

  3. 3

    Recommended: add the free UXKIN skills (no-ui-slop and uxkin-research), so Copilot knows when to look things up.

    npx skills add https://uxkin.com --skill no-ui-slop uxkin-research -g -a github-copilot -y
  4. 4

    Open Copilot Chat in Agent mode: the uxkin tools are in its tools list. Ask for real UI references while you build.

Searching needs a UXKIN plan. Using the Copilot CLI or Copilot's cloud agent instead? Those use a token; the Copilot guide has the steps.

Use UXKIN in Google Antigravity

Works in the Antigravity app, IDE and CLI. No token: you sign in to UXKIN once.

  1. 1

    Quit Antigravity, then add UXKIN to its MCP settings file. On a Mac, paste this into Terminal: it creates the file, and if you already have one it shows it instead of changing it.

    f=~/.gemini/config/mcp_config.json; if [ -s "$f" ]; then echo "ALREADY EXISTS:"; cat "$f"; else mkdir -p ~/.gemini/config && printf '{\n  "mcpServers": {\n    "uxkin": { "serverUrl": "https://uxkin.com/mcp" }\n  }\n}\n' > "$f" && echo "CREATED"; fi

    Already have MCP servers? Add the uxkin entry next to them in ~/.gemini/config/mcp_config.json:

    {
  "mcpServers": {
    "uxkin": { "serverUrl": "https://uxkin.com/mcp" }
  }
}
  2. 2

    Open Antigravity again and go to MCP Tools (or type /mcp): pick uxkin and choose Authenticate. A UXKIN page opens in your browser: log in if asked and click Allow. If Antigravity then asks for a code, copy it from the page that opens and paste it in.

  3. 3

    Recommended: in your project folder, add the free UXKIN skills, so Antigravity knows when to look things up.

    npx skills add https://uxkin.com --skill no-ui-slop uxkin-research -a antigravity -y
  4. 4

    uxkin now shows as connected in /mcp. Ask for real UI references while you build, like “find onboarding screens for a meditation app”.

Searching needs a UXKIN plan. You can disconnect Antigravity any time from your account page.

Use UXKIN in Kiro

One install adds the UXKIN power: the server plus guidance on when to use it. No token: you sign in to UXKIN once.

  1. 1

    In Kiro, open the Powers panel, choose Add Custom Power → Import power from GitHub, and paste:

    https://github.com/uxkin/agent
  2. 2

    When Kiro asks to authenticate uxkin, click Authenticate. A UXKIN page opens in your browser: log in if asked and click Allow.

  3. 3

    Ask for real UI references while you build, like “find onboarding screens for a meditation app”. Kiro turns the power on by itself when you work on UI.

Searching needs a UXKIN plan. You can disconnect Kiro any time from your account page.Prefer to add only the server? Put this in ~/.kiro/settings/mcp.json:
{
  "mcpServers": {
    "uxkin": { "url": "https://uxkin.com/mcp" }
  }
}
Get your setup prompt