Creates distinctive production-grade frontend UIs for web components, pages, and apps, emphasizing intentional visual design, typography, color, layout, and motion.
npx claudepluginhub pcoulbourne/everything-claude-codeThis skill uses the workspace's default tool permissions.
Use this when the task is not just "make it work" but "make it look designed."
Compares coding agents like Claude Code and Aider on custom YAML-defined codebase tasks using git worktrees, measuring pass rate, cost, time, and consistency.
Designs and optimizes AI agent action spaces, tool definitions, observation formats, error recovery, and context for higher task completion rates.
Designs, implements, and audits WCAG 2.2 AA accessible UIs for Web (ARIA/HTML5), iOS (SwiftUI traits), and Android (Compose semantics). Audits code for compliance gaps.
Use this when the task is not just "make it work" but "make it look designed."
This skill is for product pages, dashboards, app shells, components, or visual systems that need a clear point of view instead of generic AI-looking UI.
Pick a direction and commit to it.
Safe-average UI is usually worse than a strong, coherent aesthetic with a few bold choices.
Before coding, settle:
Possible directions:
Do not mix directions casually. Choose one and execute it cleanly.
Define:
Use CSS variables or the project's token system so the interface stays coherent as it grows.
Prefer:
Avoid defaulting to a symmetrical card grid unless it is clearly the right fit.
Use animation to:
Do not scatter generic micro-interactions everywhere. One well-directed load sequence is usually stronger than twenty random hover effects.
Use atmosphere:
Flat empty backgrounds are rarely the best answer for a product-facing page.
Never default to:
Before delivering: