UI Skills Root

From the author

Use before UI-related work to select the smallest useful UI Skills context through the ui-skills CLI.

— the description by ibelick

AutoGineer summary

Written by AutoGineer from the skill’s own files, not by the author

UI Skills Root acts as a central dispatcher for UI-related development tasks. By interacting with the ui-skills CLI, it helps agents identify the specific UI domain required for a project, ensuring that only the most relevant and minimal context is loaded. This approach optimizes agent performance by preventing the loading of unnecessary information and focusing on specific frameworks, visual styles, or layout requirements.

What it does

Determines if a user request is UI-related.
Categorizes UI tasks to narrow down the required skill set.
Inspects available skill categories via CLI commands.
Selects the smallest, most relevant skill context for a task.
Loads specific skill sets to provide targeted assistance.
Enforces a limit of up to three skills to maintain context efficiency.

When to use it

When starting a new UI development task in an AI-assisted environment.
When you need to ensure your agent is using the most specific UI guidelines or patterns.
When you want to avoid loading excessive or irrelevant documentation for a UI project.
When working with specific UI frameworks and needing the correct context.

Advantages

Reduces context bloat by loading only the necessary skills.
Improves agent accuracy by prioritizing specific over broad skills.
Streamlines the workflow for UI-centric development tasks.
Provides a structured protocol for selecting the right tools for the job.

Usage examples

“I need to build a responsive navigation bar for my React app.”: The agent identifies the UI-related nature of the request, inspects the available categories, selects the most relevant React-specific layout skill, and loads it to assist with the implementation.
“Help me improve the visual accessibility of this dashboard.”: The agent routes the request to the appropriate visual or accessibility skill category, selects the most specific skill available, and applies it to the current task.

Install

Download the skill as a ZIP:
https://autogineer.com/agent-skills/ibelick/ui-skills-root/download

Unzip it into the cross-client skills folder of your project:

mkdir -p .agents/skills && unzip ui-skills-root.zip -d .agents/skills

Documentation by ibelick

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.

Files

ATTRIBUTION.mdAdded by AutoGineer901 B
LICENSELicence file added by AutoGineer1.0 KiB
SKILL.md1.4 KiB

Requirements and compatibility

Works with: Claude Code, Claude apps, OpenAI Codex, GitHub Copilot, Cursor, Gemini CLI, Kiro, OpenCode, Goose, Amp, Roo Code, JetBrains Junie, Factory Droid, Devin (ex-Windsurf), Mistral Vibe, OpenHands, Letta

“Works with” means the tool reads the open Agent Skills format; a skill written for one tool may use features others lack.

Needs: Needs Node.js

Security

No issues found by our static scan· No issues found

A static scan is not a guarantee. Skills are third-party content: review a skill before you let an agent use it.

Handoff
Matt Pocock· Community
Generates a concise handoff document to facilitate seamless transitions between AI agents.
Agent toolingClaude CodeClaude appsOpenAI Codex+14 more
MITGitHub stars of the source repository317.5k
Chief Of Staff
Matt Pocock· Community
A strategic orchestration agent that manages long-term goals by coordinating subagents and maintaining a persistent knowledge wiki.
Agent toolingClaude CodeClaude appsOpenAI Codex+14 more
MITGitHub stars of the source repository317.5k
Ask Matt
Matt Pocock· Community
A central routing skill that helps you identify the correct agent skill or workflow for your current situation.
Agent toolingClaude CodeClaude appsOpenAI Codex+14 more
MITGitHub stars of the source repository317.5k
Claude Handoff
Matt Pocock· Community
Seamlessly transfer your current conversation context to a new background agent.
Agent toolingClaude CodeClaude appsOpenAI Codex+14 more
MITGitHub stars of the source repository317.5k
Executing Plans
Jesse Vincent (obra)· Community
Execute implementation plans inline without subagents, maintaining rigorous progress tracking and verification.
Agent toolingClaude CodeClaude appsOpenAI Codex+14 more
MITLow riskHas scriptsGitHub stars of the source repository314k
Using Superpowers
Jesse Vincent (obra)· Community
A mandatory protocol for AI agents to identify and invoke relevant skills before performing any task or responding to user input.
Agent toolingClaude CodeClaude appsOpenAI Codex+14 more
MITGitHub stars of the source repository314k