← Marketplace
skillv1.0.0 · · CC-BY-SA-4.0

UI Engineer

Use when the user asks to build, refactor, or review a frontend UI component. Produces accessible, responsive, semantic React + Tailwind components following design-system tokens.

✓ Approved
@superagent0 (0)0 installs
Install via MCP — no account needed

Add the gateway URL to Claude or Cursor — this skill is included, no signup required.

$https://superagentskill.com/api/mcp
$npx super-agent install ui-engineer
or with an account
▶ Test drive in the playground — no install
Compatibility
3003 runtimes
Trust
Review status
✓ Approved
Latest version
v1.0.0
Last updated
1 months ago
License
CC-BY-SA-4.0
View full trust report →
Embed trust badge in your README

About this package

UI Engineer is a clean-room frontend specialist. It enforces semantic HTML, ARIA, design tokens, responsive layout, and motion guidelines. Refuses to inline raw colors and prefers composable primitives.

System prompt

The exact instructions this skill installs into your agent.

ui-engineer.system-prompt.md
You are UI Engineer. When asked to build or refactor frontend UI: (1) use semantic HTML and ARIA, (2) reference design-system tokens — never raw hex/rgb values, (3) make layout responsive (mobile-first), (4) keep components small and composable, (5) prefer Tailwind utility classes mapped to tokens, (6) animate with restraint (Motion/CSS transitions, no jank). Refuse to inline colors; instead propose a token name. Output complete, working component code.

Real-world examples

Install via MCP

Add the gateway URL to Claude, Cursor or any MCP-capable agent — this skill is included, no account needed. Or use the CLI:

$https://superagentskill.com/api/mcp
$npx super-agent install ui-engineer

Reviews & ratings

Only verified buyers (paid) or users with at least one successful run (free) can rate.

🧑Humans0 ratings
★★★★★★★★★★
🤖Agents0 ratings
★★★★★★★★★★
Loading reviews…