ui-skills-root
ibelick/ui-skills
Routing layer to select the right UI skill for your task through the ui-skills CLI.
What is ui-skills-root?
UI Skills Root is the entry point for UI-related work in coding agents. It helps you identify your UI goal, select the appropriate skill category, and load only the smallest useful skill context needed to implement—avoiding unnecessary overhead.
- Routes UI tasks to the correct skill category via CLI inspection
- Enforces minimal skill loading (prefer 1 skill, max 3 for broad work)
- Provides selection rules prioritizing specificity and framework-fit
- Asks clarifying questions when task intent is unclear
- Integrates with Codex, Cursor, and Claude Code workflows
How to install ui-skills-root
npx skills add https://github.com/ibelick/ui-skills --skill ui-skills-root- Node.js and npm installed
- Access to npx and the ui-skills CLI
How to use ui-skills-root
- 1.Run `npx ui-skills start` to launch the routing interface
- 2.Answer the agent's clarifying question if your goal is unclear
- 3.Let the skill identify the likely category for your task
- 4.Use `npx ui-skills categories` to inspect available categories if needed
- 5.Use `npx ui-skills list --category <category>` to see skills in that category
- 6.Use `npx ui-skills get <slug>` to load the selected skill(s)
- 7.Proceed with implementation using only the loaded skill context
Use cases
- Starting a new UI component or page build to pick the right skill context
- Deciding between multiple UI skills when the task spans categories
- Reviewing or redesigning a UI surface by loading focused skill sets
- Cleaning up UI code by selecting the most specific craft or layout skill
- Routing non-UI tasks to confirm no skill is needed
- AI coding agents (Claude Code, Cursor, Codex)
- Developers using the ui-skills ecosystem
- Teams standardizing UI skill selection workflows
ui-skills-root FAQ
Use it at the start of any UI-related task in a coding agent. It helps you pick the right skill and avoid loading unnecessary context.
Prefer 1 skill. Use 2 only when the task needs two clear angles. Use 3 only for broad review, redesign, or multi-surface work. Never use more than 3.
The skill will return 'no skill needed' and you can proceed without loading any UI skill context.
Route by topic first, then stack, then specificity. Prefer specific skills over broad ones, and framework-specific skills when the stack is obvious.
Yes, use `npx ui-skills categories` to see all categories, then `npx ui-skills list --category <category>` to see available skills in each.
Full instructions (SKILL.md)
Source of truth, from ibelick/ui-skills.
name: ui-skills-root description: Use before UI-related work to select the smallest useful UI Skills context through the ui-skills CLI. license: MIT metadata: author: ibelick version: "1.0.0"
UI Skills Root
You are the routing layer for UI Skills.
This skill is shown by npx ui-skills start and is also available in the registry.
Use it when an agent in Codex, Cursor, or Claude Code has a clear UI goal.
If the goal is unclear, ask one short question.
If the goal is clear, choose the right category, load the smallest useful skill context, then implement.
Protocol
- decide if the task is UI-related
- if not, return
no skill needed - identify the likely category
- inspect that category with the CLI
- select the smallest useful skill set
- load only selected skill(s)
- implement using that context
CLI
npx ui-skills start
npx ui-skills categories
npx ui-skills list --category <category>
npx ui-skills get <slug>
Selection Rules
Prefer 1 skill.
Use 2 only when the task needs two clear angles.
Use 3 only for broad review, redesign, or multi-surface work.
Never use more than 3.
Route by topic, then stack, then specificity.
Prefer specific skills over broad skills.
Prefer framework-specific skills when the stack is obvious.
For quick cleanup, prefer the most specific craft, visual, or layout skill available.
If unsure, inspect categories and pick the safest narrow skill.
Related skills
More from ibelick/ui-skills and the wider catalog.

baseline-ui
Enforce UI baseline constraints to prevent AI-generated interface slop.

create-design-md
Extract and document design systems from repositories or live websites into persistent DESIGN.md files.

fixing-accessibility
Audit and fix HTML accessibility issues including ARIA labels, keyboard navigation, and focus management.

fixing-metadata
Audit and fix HTML metadata, Open Graph tags, canonical URLs, and structured data for SEO and social sharing.

gmail-skill
Read, search, send, and draft Gmail emails and manage Google contacts with multi-account support.

open-computer-use
Platform-neutral CLI and MCP server for GUI automation across macOS, Linux, and Windows.