For coding agents

Your agent, fluent in Wingo UI.

A remote MCP server, a CLI, agent rules and a Claude skill. Your agent finds the right component, follows the design system and installs the source, instead of reinventing a date picker.

Get an API key Read the MCP docs

Works withClaude CodeCodexGemini CLIGrokCursor

How it works

Three steps to your first screen

Create an API key
Sign in and create a key under API keys in your account. Keys start with wui_ and are stored hashed.
Connect your agent
Add the MCP server with one command, or run npx wingo-ui login to use the CLI.
Ask for a screen
Describe what you need. The agent searches Wingo UI, reads the props and rules, and installs what fits.

Setup

Pick your agent

The snippets read your key from WINGO_UI_API_KEY. A free account (email only) gets a key with the source of every free component.

Prefer the terminal?

$npx wingo-ui@latest login

Opens your browser to approve the CLI, then stores the key for the CLI and the local MCP server.

Run in your terminal

Terminal

claude mcp add --transport http wingo-ui https://wingo-ui.com/mcp --header "Authorization: Bearer $WINGO_UI_API_KEY"

Add to .mcp.json

.mcp.json

1{
2  "mcpServers": {
3    "wingo-ui": {
4      "type": "http",
5      "url": "https://wingo-ui.com/mcp",
6      "headers": {
7        "Authorization": "Bearer ${WINGO_UI_API_KEY}"
8      }
9    }
10  }
11}

MCP tools

What your agent can do

10 tools over one endpoint. Source for Pro components comes with a Pro key, everything else is open.

search_components
Find components, blocks, hooks and helpers by keywords, category or access.
list_categories
Browse the categories and how many items each one has.
get_componentPro
Props, parts, usage, dependencies, the install command and the source.
get_blockPro
A full screen or section, the components it uses and its source.
get_design_rules
Tokens, sizes, motion, forms, overlays and mobile rules.
get_theme_tokens
The CSS variables for light and dark mode.
get_install_instructions
Project setup for Next.js or Vite, step by step.
check_updates
Compare your installed components with the latest release.
get_changelog
Recent releases and what changed in them.
get_account_status
Whether the key has Pro, with the links to upgrade.

CLI

One CLI for people and agents

npx wingo-ui works in any React project. Every command also speaks JSON for scripts and agents.

wingo-ui initSet up tokens, utils and path aliases.
wingo-ui add data-tableCopy components and their dependencies.
wingo-ui loginSign in through your browser.
wingo-ui outdatedList components with newer versions.
wingo-ui updateMerge updates and keep your edits.
wingo-ui agents install claudeInstall rules and skills for your agent.
wingo-ui mcpRun a local MCP server over stdio.

Rules and skills

Your agent learns the house style

wingo-ui agents install writes short, managed rule files. The details come live from the MCP server, so the rules never go stale.

Claude Code.claude/skills/wingo-ui/SKILL.mdCLAUDE.md
CodexAGENTS.md
Gemini CLIGEMINI.md
GrokAGENTS.md
Cursor.cursor/rules/wingo-ui.mdc

$npx wingo-ui@latest agents install claude

Read llms.txt

Prompts to try

Start with a real screen

Copy one into your agent and watch it build with Wingo UI.

Build a settings page with a profile form, notification switches and a danger zone. Use Wingo UI.
Create a CRM pipeline screen with a kanban board, deal cards and a filter sheet on phones. Use Wingo UI.
Make a mobile-first checkout with an address form, a coupon field and a sticky pay button. Use Wingo UI.
Check which Wingo UI components in this project are outdated and update them, keeping my changes.

FAQ

About agents and MCP

No. Search, docs, design rules and tokens work without a key. A free account (email only, no card) gives you a key with the source of every free component. Source for Pro components needs a key from a Pro account. See pricing.

Any client that speaks MCP. We ship ready-made setup for Claude Code, Codex, Gemini CLI, Grok and Cursor, and a local stdio server for clients without remote MCP.

No. The MCP server only receives the tool calls your agent makes, such as a search query or a component name. Your project files stay with you and your agent.

The MCP server always serves the latest release, so new components and changed props show up right away. The rule files only point to the server, so they rarely change.

Yes. Every component is also a shadcn registry item, so free items install straight from their URL. The installation guide shows both ways.

Your agent, fluent in Wingo UI.

Three steps to your first screen

Create an API key

Connect your agent

Ask for a screen

Pick your agent

What your agent can do

One CLI for people and agents

Your agent learns the house style

Start with a real screen

About agents and MCP

Do I need Pro to use the MCP server?

Which agents and editors are supported?

Does my code leave my machine?

How does my agent stay up to date?

Can I use the shadcn CLI instead?

Give your agent better taste.