Skills
Installable instructions that teach an AI assistant how NachUI components are built, composed and documented, so the code it writes looks like the rest of your project.
An assistant that can read your components still does not know your conventions. It cannot tell from a single file that a
Card is composed with dot notation, that variants belong in a CVA config declared outside the component, or that colors always go through a token instead of a hex value. It will guess, and the guess will look almost right.Skills close that gap. Each one is a markdown file you install into your project, describing how a specific part of NachUI is meant to be worked on. The assistant loads the one that matches what you are doing.
Install
Every skill installs on its own with the skills CLI:
npx skills add github:figueroaignacio/ui-skills/skills/nachui-usageThe file lands in
.agents/skills/<name>/SKILL.md inside your project and gets recorded in skills-lock.json, so it is committed with everything else and your whole team gets the same instructions.Available skills
nachui-compound-componentssource ↗
Use when building, extending, or consuming compound components, meaning components made of multiple sub-parts assembled via dot notation (e.g. Dialog.Trigger, Card.Header, Accordion.Item).
npx skills add github:figueroaignacio/ui-skills/skills/nachui-compound-componentsnachui-designsource ↗
Use when styling, designing, or adjusting UI layout, colors, variables, typography, and visual assets in NachUI.
npx skills add github:figueroaignacio/ui-skills/skills/nachui-designnachui-usagesource ↗
Use when consuming, importing, or integrating NachUI components inside apps/web or any app that depends on @repo/ui.
npx skills add github:figueroaignacio/ui-skills/skills/nachui-usageThey are synced from github.com/figueroaignacio/ui-skills, which is where you edit them.
Which one you want
Three skills, one job each. Most projects want the first, and the other two once the assistant starts touching the visual side.
- nachui-usage is the one to install if you build with NachUI. Import paths, which primitive to reach for, how the pieces compose, what the CLI puts where.
- nachui-compound-components teaches the dot notation pattern:
Dialog.Trigger,Card.Header, the shared context behind them, and how to extend a component with a new part without breaking its types. - nachui-design carries the tokens, the spacing and typography rules and the dark mode contract, so an assistant stops inventing hex values and arbitrary sizes.
They are written for people consuming the library. The skills we use to develop NachUI itself live in the same repository but are not listed here, because they assume the monorepo and would only get in the way of your project.
How they work
Every skill declares in its frontmatter when it should be used:
The assistant reads those descriptions, matches them against what you asked for, and pulls in the relevant file before it starts writing. You do not have to name the skill yourself, though nothing stops you from doing it.
Skills and llms.txt do different jobs
llms.txt hands an assistant the documentation. Skills hand it the
conventions. The first tells it what a
Dialog is, the second tells it how this project expects
a Dialog to be written.Related
- llms.txt for pointing an agent at the docs themselves.
- Compound Components for the pattern the skill enforces.
- CLI for the commands that put components in your project.
Found something to improve?
Notice a bug, typo, or missing detail on this page? Help us make the documentation better by opening a GitHub issue.