Copy
Master UI copywriting skill that audits every user-facing string in the project — CTAs, error messages, empty states, placeholders, loading messages, headings, tooltips, confirmations — and rewrites them to be specific, benefit-first, and actionable. Works screen by screen in priority order with visual verification. Use when user wants to improve UI copy, fix button labels, write empty states, im…
A11y
Master accessibility audit skill that scans every screen with axe-core, tests keyboard navigation, checks focus visibility, audits ARIA and semantic structure, then fixes every violation from critical down to minor. Works screen by screen in priority order with visual and programmatic verification. Use when user wants to fix accessibility issues, meet WCAG 2.1 AA, improve keyboard nav, or invokes…
Uiux
Master UI/UX redesign skill that audits every screen in the project, ranks them by priority, then redesigns each one recursively until pixel-perfect — applying color theory, typography, hierarchy, spacing, and accessibility principles automatically. Use when user wants to improve, redesign, or polish the UI/UX of an app, says "make the UI better", "redesign this", "pixel perfect", or invokes /uiu…
Ui Init
One-time setup for the UI/UX skill set. Detects what's already in place, installs missing dependencies (Playwright, axe-core), identifies the token home, checks for a design brief, and writes a ## UI skills section to CLAUDE.md/AGENTS.md so every skill knows the project's setup. Run this before using /uiux, /animate, /copy, /a11y, /tokens, /landing, or /design-grill for the first time on a new pr…
Design Grill
Design intent grilling session. Interviews the user relentlessly about visual direction — brand personality, audience, references, color, typography, animation level, component style — before any UI work begins. Resolves every ambiguous design decision and writes a DESIGN-BRIEF.md that all other UI skills can reference. Use before starting /uiux, /tokens, /animate, or /landing on a new project, o…
Ui Design Principles
A Claude skill from dawitlabs/ui-skills.
Uicolor
Color master skill. Audits every color decision across the product — balance, hierarchy, harmony, temperature, saturation, shadow construction, hover states — and corrects them using HSB color theory. Extracts the actual rendered color palette from every screen, identifies what's wrong and why, then fixes it systematically. Use when colors feel off, the UI looks flat or garish or cold, brand colo…
Landing
Landing page conversion specialist. Audits every section of a marketing or product landing page — hero, social proof, features, pricing, CTAs — for conversion friction, structural weakness, and performance issues. Fixes section order, CTA hierarchy, trust signals, and load time. Verifies every change at both desktop and mobile. Use when user wants to improve landing page conversions, audit a mark…
Animate
Master animation and micro-interaction skill that audits every interactive element in the project, adds or fixes animations using correct timing, easing, and CSS properties, verifies results with Playwright hover screenshots and video recording, and ensures prefers-reduced-motion is always respected. Use when user wants to add animations, improve micro-interactions, make the UI feel more premium,…
Tokens
Design token audit and enforcement skill. Finds every hardcoded color, spacing value, shadow, border radius, font size, and z-index in the codebase, maps them to an existing or proposed token system, then replaces hardcoded values with tokens — making the design system maintainable, themeable, and dark-mode-ready. Use when user wants to set up a token system, enforce design consistency, prepare f…