Introduction
UI Polish is polished UI for AI products: React components and whole screens with every state, transition and edge case worked out, plus the design rules behind them. Your coding agent gets both over MCP. It writes the components into your project as files you own, and follows the rules for the UI it writes itself.
Installation
Run this in your project:
Then run /mcp in Claude Code to check that UI Polish is connected.
How it works
Ask for a component by name, like “add a date picker”. Your agent calls get_component, gets the code, its CSS and a guide to using it, and writes them into your project. The interactive ones (menus, selects, dialogs, tabs) run on Base UI for focus, keyboard and positioning, so your agent also installs @base-ui/react once. Before writing any other UI, the server has your agent read the rules for what it’s touching, so the screens it writes itself keep the same spacing, motion and states as the components.
The free components, the rules and the free blocks need no account or key. Pro components and blocks need a license key.
Using Tailwind? Your agent gets the components in Tailwind’s components layer, so your utility classes override them. Tailwind CSS has the setup.
Your design system
Components read only --ui-* tokens: space, radius, control heights, durations, easings, color, focus and elevation. Your agent maps each one to a variable you already have, so a button takes your color and radius and its behavior comes from UI Polish.
Tools
| Tool | Returns |
|---|---|
get_rules(topic?) | The rules for one topic: motion, states, typography, spacing, surfaces, foundations or antipatterns. Without a topic, the tokens and the pre-ship checklist. |
list_components() | Every component, with a one-line summary, its access and its version. |
get_component(name, tailwind?) | One component’s code and guide, with the components it depends on. With tailwind: true, its CSS comes in Tailwind’s components layer. |
get_theme(hue, tint?, brand?) | A theme in one brand color: the accent, the text on it, tinted grays and colored primary buttons, light and dark, every text color checked for contrast. |