Skip to main content

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-usage
The 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-cli-developmentsource ↗

Use when modifying or extending CLI commands, prompts, build configurations, or API integrations in packages/cli.

npx skills add github:figueroaignacio/ui-skills/skills/nachui-cli-development
nachui-component-developmentsource ↗

Use when creating, modifying, or refactoring React components in the packages/ui directory of NachUI.

npx skills add github:figueroaignacio/ui-skills/skills/nachui-component-development
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-components
nachui-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-design
nachui-docs-managementsource ↗

Use when modifying documentation pages, routing, next-intl translations, MDX schemas, or AI functionality in apps/docs.

npx skills add github:figueroaignacio/ui-skills/skills/nachui-docs-management
nachui-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-usage
They are synced from github.com/figueroaignacio/ui-skills, which is where you edit them.

Which one you want

Most of the time you only need the first one.
  • nachui-usage is for consuming NachUI in an app. Import paths, which primitive to reach for, how to compose them. This is the one to install if you are building with the components rather than on them.
  • nachui-component-development is for writing or refactoring primitives themselves: file layout, CVA configs, forwarded refs, display names.
  • nachui-compound-components covers the dot notation pattern, the shared context, and how to add a sub-component without breaking the typing.
  • nachui-design covers tokens, spacing, typography and the visual rules, so an assistant stops inventing hex values.
  • nachui-cli-development is for working inside packages/cli, on commands, prompts and registry calls.
  • nachui-docs-management is for the docs app: MDX schemas, routing, translations.

How they work

Every skill declares in its frontmatter when it should be used:
1---
2name: 'nachui-compound-components'
3description: 'Use when building, extending, or consuming compound components.'
4---
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.

Create an Issue
Previousllms.txt
NextAccordion
Ctrl+I