Skills

The Gaudi UI skill gives AI agents such as Claude Code the knowledge to work with Gaudi UI: what patterns are, how to install them, and how to apply a pattern's styles to a component you already have.

Install

npx skills add gaudi-ui/gaudi-ui

This installs the skill into your project. Your agent loads it when you work with Gaudi UI. Learn more about skills at skills.sh.

What's included

Patterns and setup

What a pattern is, the CLI commands, and how patterns use the theme, the type scale and cn.

Applying styles

The workflow for styling your own components from patterns: the default styles first, then each variant, with a cva example. It covers how to resolve conflicts with classes you already have, how to apply a pattern's props, and how to handle components with several parts.

Rules

The conventions every pattern follows, so the agent's code follows them too: Base UI's own API for composition, semantic theme classes, start and end classes for RTL, and accessible icons.

With the MCP server

The skill uses the MCP server's tools when they are connected. Without the server, it reads the same styles from the registry's JSON files. With both installed, the server provides the data and the skill the steps to apply it.