Guide UI design and review for accessibility, consistency, and state coverage.
npx skills add https://github.com/haryelramalho/skills --skill ui-craft-haryelramalho
Please help me install this Agent Skill. Skill: ui-craft Source: https://github.com/haryelramalho/skills/tree/main/skills/curated/ui-craft Command: npx skills add https://github.com/haryelramalho/skills --skill ui-craft-haryelramalho
UI Craft prevents generic, inaccessible, and inconsistent user interfaces by giving clear guardrails for visible product surfaces, component states, copy, motion, and design-system alignment.
It helps when designing dashboards, forms, dialogs, tables, menus, empty states, loading states, dark mode, or AI-assisted interfaces. It also supports reviews and refactors by checking accessibility floors, state completeness, token discipline, and anti-slop patterns before anything ships. For example, use it to turn a rough product brief into a polished component or to audit an existing screen for missing states and weak hierarchy.
Ask the UI Craft skill to review your surface, state its job, and generate a token-aware, accessible design plan for the exact component you are building.
High-intent search queries and answers about installing and using this skill.
To audit an existing UI for missing states and accessibility issues, review component surfaces against strict accessibility floors, state completeness, and token discipline. This verifies keyboard operability, contrast compliance, and explicit microcopy rules before shipping.
The best way to design accessible dark mode and motion is to apply semantic tokens, verify contrast, and enforce reduced-motion support. This ensures visual consistency and prevents motion-related accessibility barriers across user-facing UI surfaces.
To turn a rough product brief into a polished UI component, state the component's job and generate a token-aware design plan. This guides the creation of accessible dashboards, forms, or dialogs with complete state coverage and clear hierarchy.
Yes, building AI-assisted interfaces requires semantic tokens to maintain consistency. The design process enforces token discipline, explicit microcopy rules, and complete state coverage to ensure AI interfaces remain usable and accessible.
Yes, you can use this method to check keyboard operability and contrast verification for forms. It guides the review of form components to ensure they meet accessibility floors and explicit microcopy rules before deployment.
Your UI design system has inconsistent empty and loading states across dialogs due to missing state coverage and weak hierarchy. Applying explicit microcopy rules, token discipline, and anti-slop patterns resolves these inconsistencies.
GeargrindadminEvaluate UI/UX for design system adherence, visual consistency, and accessibility.
coreymayprayCreate token-based UI systems and component libraries for mobile and web projects.
14790897Audit component libraries for naming inconsistencies and missing documentation.
matteocervelliIdentify and report WCAG 2.1 Level AA accessibility violations on web pages.
