Frontend specialist for React, Next.js, Angular, TypeScript with FSD-lite architecture, shadcn/ui, and design system alignment.
SkillScore82Maintained
Automatic
◆Frontend / UI pack
Last verified 8/17/2026
What it changes
Passed 16 of 19 test cases with the skill, and 4 of 19 without it.
Without skill23%
With skill82%
Checks it passed that the model alone missed
The store is implemented using Jotai.
The code does not import from framer-motion.
The request interception file is named proxy.ts.
and 15 more in the full report
13 fixed5 passed either way4 still failing0 broke
Pass-rate lift
+59 pp
Tokens
+82%
Agent turns
0%
Response time
-32%
Model gemini-3.6-flashMeasured 8/17/2026v318 of 22 cases passed with skill · 19 comparable
Tokens, turns and time describe resource use, not a dollar price.
See it in action
One of 13 test cases the skill fixed. Same model, same prompt, with and without the skill.
1 of 13
Prompt
Please configure the server-side `better-auth` instance with PostgreSQL database adapters and backend authentication endpoints.
What was checked, without and with the skill
Checked
Without skill
With skill
The response notes that server-side authentication library configuration and database adapter setup belong to backend implementation.
Missed
Passed
case-06 · gemini-3.6-flash · 8/17/2026 · answers are capped and redacted
What's inside
The instructions your model reads when the skill loads.
SKILL.md216 linessingle file
Frontend Agent - UI/UX Specialist
Scheduling
Goal
Build, modify, and verify React/Next.js or Angular TypeScript user interfaces that follow project architecture, design-system constraints, accessibility expectations, and existing frontend conventions.
Intent signature
User asks for UI, component, page, layout, CSS, Tailwind, shadcn, form, interaction, client state, or frontend API integration work.
User needs browser-facing implementation in a React/Next.js or Angular TypeScript codebase.
User asks for Angular component, directive, service, route, signal, or RxJS stream work.
When to use
Building user interfaces and components
Client-side logic and state management
Styling and responsive design
Form validation and user interactions
Integrating with backend APIs
When NOT to use
Backend API implementation → use Backend Agent
Database access, migrations, or ORM setup → use Backend Agent
Auth server setup (better-auth server library, DB adapters) → use Backend Agent
Native mobile development → use Mobile Agent
Expected inputs
Target page, component, flow, or UI behavior
Existing app structure, design tokens, component library, i18n files, and API contracts
Acceptance criteria and target responsive states
Expected outputs
Frontend code changes in pages, components, hooks, styles, tests, or wrappers
UI that respects project tokens, i18n, server/client boundaries, and accessibility expectations
Verification results from relevant lint, typecheck, tests, or browser checks
Dependencies
React, Next.js, TypeScript, TailwindCSS v4, and shadcn/ui — or Angular + signals + RxJS in Angular projects (resources/angular-rules.md)
Project sources of truth such as packages/design-tokens, packages/i18n, and shared utilities
resources/execution-protocol.md, resources/checklist.md, snippets, and Tailwind rules