Ui Skills Root
- 2.4k installs
- 6.9k repo stars
- Updated August 3, 2026
- ibelick/ui-skills
ui-skills-root is a routing skill that uses the ui-skills CLI to select the smallest useful UI design context before an agent implements screens in Codex, Cursor, or Claude Code.
About
ui-skills-root is version 1.0.0 MIT-licensed routing skill by ibelick that acts as the entry point for the UI Skills registry. Agents run `npx ui-skills start` or follow the seven-step protocol: confirm the task is UI-related, identify the category, inspect it via CLI, select the smallest useful skill set, load only those skills, then implement. ui-skills-root prevents agents from loading entire design libraries when a focused subset suffices. Developers reach for ui-skills-root in Codex, Cursor, or Claude Code whenever an agent has a clear UI goal and needs consistent patterns, components, and styling guidance for modern interface quality.
- Root entry for ibelick UI skills
- Component and layout guidance
- Consistent styling conventions
- Covers web and extension surfaces
- Improves visual polish of agent UI work
Ui Skills Root by the numbers
- 2,436 all-time installs (skills.sh)
- +326 installs in the week ending Aug 5, 2026 (Skillselion tracking)
- Ranked #129 of 1,880 Design & UI/UX skills by installs in the Skillselion catalog
- Data as of Aug 5, 2026 (Skillselion catalog sync)
npx skills add https://github.com/ibelick/ui-skills --skill ui-skills-rootAdd your badge
Show developers this skill is listed on Skillselion. Paste this into your README.
| Installs | 2.4k |
|---|---|
| repo stars | ★ 6.9k |
| Last updated | August 3, 2026 |
| Repository | ibelick/ui-skills ↗ |
How do agents load minimal UI design context?
Apply consistent UI patterns, components, and styling guidance when implementing screens so agent-built interfaces match modern design quality.
Who is it for?
Developers using Codex, Cursor, or Claude Code who want agents to load only the minimal UI Skills context needed for a specific interface task.
Skip if: Pure backend work, tasks with no UI component, or projects that already have a complete custom design system documented elsewhere.
When should I use this skill?
The agent faces a UI implementation task and needs to route to the right UI Skills category via the ui-skills CLI.
What you get
Selected UI skill subset loaded via CLI with category-matched patterns, components, and styling guidance applied to implementation.
- Loaded UI skill context
- Implemented UI screen
By the numbers
- Version 1.0.0 MIT-licensed routing skill
- 7-step protocol from task detection to implementation
Files
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
1. decide if the task is UI-related 2. if not, return no skill needed 3. identify the likely category 4. inspect that category with the CLI 5. select the smallest useful skill set 6. load only selected skill(s) 7. 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
Frontend DesignGenerate distinctive, production-grade frontend interfaces and components that avoid generic AI aesthetics.716k165k
Web Design GuidelinesAutomatically audit frontend code against the latest Vercel Web Interface Guidelines for consistency, accessibility, and UX quality.498k29.6k
Lark WhiteboardGenerate valid Lark Whiteboard (Feishu Board) documents with correctly placed connectors, automatic routing, and proper schema compliance directly from agent inst389k16k
Sleek Design Mobile AppsGenerate mobile app screens and UI from plain English descriptions using the Sleek.design API.315k476
Design Taste FrontendOverride generic LLM frontend output with intentional, metric-driven UI/UX taste.301k69.4k
Ui Ux Pro MaxGet instant, high-quality UI/UX decisions, component recommendations, style guidance, and code improvements across web and mobile projects.290k112kHow it compares
Use ui-skills-root to discover and load focused UI context; skip it when a project already pins a single complete UI skill with no routing needed.
FAQ
How do you start ui-skills-root?
ui-skills-root is activated via `npx ui-skills start`, which is also how the skill appears in the registry. Agents then inspect categories with `npx ui-skills categories` and load only the selected subset.
What is the ui-skills-root routing protocol?
ui-skills-root follows seven steps: confirm UI relevance, identify category, inspect via CLI, select smallest useful skills, load only those skills, then implement. If the task is not UI-related, the skill returns no skill needed.