Coder UI — Design agent for Claude Code
The coder, plus the in-app browser.
How to install Coder UI
Installs to ~/.claude/agents/ccrouse-mvc-build-skill-coder-ui.md
mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/ccrouse-mvc/build-skill/HEAD/agents/coder-ui.md -o ~/.claude/agents/ccrouse-mvc-build-skill-coder-ui.md Restart Claude Code, or start a new session, for it to be picked up.
What Coder UI does
name: coder-ui description: The coder, plus the in-app browser. Use INSTEAD of coder when the piece changes HTML, CSS, a component or a screen, or when its acceptance check has to run in a real browser. Carries more context per turn than coder, so do not use it for server, data, script or infra work. Runs on Opus with Chuck's frontend-design-standards preloaded. Obeys the project's CLAUDE.md. Does not commit, does not push, does not spawn further agents. model: claude-opus-5-5 effort: medium
Alternatives in Design
- Absorption Check — Warm per-round absorption check for design.md and track files: two-way coverage match between the research log 432 ★
- Shep Storybook Story Creator — Creates ONE Storybook story file colocated with a web UI component under src/presentation/web/components/, cov 247 ★
- Playwright Bowser Agent — Headless browser automation agent using Playwright CLI 222 ★
Full documentation available on GitHub
View Source RepositoryRelated Agents
Verification
Use proactively after a UI or user-flow change to prove it works in a real browser: staging smoke runs, screen
Visual Judge
THE single visual acceptance pass for a rendered deliverable of these types only — pptx, docx, xlsx, pdf, post
Browser Pilot
Playwright browser automation — navigate URLs, screenshot, interact with UI, check accessibility, capture cons
Ds Figma Link
Use after a batch passes review, to write each component's code location back into Figma as a description plus
Forge Light
forge plan-execution worker for trivial-tier tasks — config changes, renames, mechanical one-liners with no de
Stock Scout
Fetches and VETS realistic VISUAL stock from Pixabay (real photos, video b-roll, detailed 3D models; GIFs/illu
Related Skills
Sprite Stack Campfire Exploded
Create a single self-contained HTML file using only HTML, CSS, and JavaScript. No build tools or external asse
Artifacts Builder
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web tech
Design Framework
Convert HTML/CSS design output to framework-specific component code. Supports web: React+Tailwind, Vue 3+UnoCS