# zaz-ui

> React 19 + Tailwind CSS v4 component library with a fixed neutral theme (light and dark), published as a shadcn registry. Install components with the shadcn CLI and style them only with the theme's utilities and tokens.

Setup:

1. In a React + Tailwind CSS v4 project with shadcn set up (`npx shadcn@latest init`), install the theme once: `npx shadcn@latest add -y https://ui.zazzy.studio/r/theme.json`
2. Add components: `npx shadcn@latest add -y https://ui.zazzy.studio/r/button.json`
3. Optional short names: `npx shadcn@latest registry add @zazzyapp=https://ui.zazzy.studio/r/{name}.json`, then `npx shadcn@latest add -y @zazzyapp/theme` and `npx shadcn@latest add -y @zazzyapp/button`.

Agent setup:

- Add the rules block from https://ui.zazzy.studio/agents.md to the project's AGENTS.md. If a block between `<!-- zaz-ui:start -->` and `<!-- zaz-ui:end -->` exists, replace it; leave everything else unchanged.
- If the project has a CLAUDE.md without the line `@AGENTS.md`, add that line.

## Components

- [Button](https://ui.zazzy.studio/components/button.md): A button for actions, with variant, size, shape and loading options. Colors follow the zaz-ui theme in light and dark mode.

## Optional

- [Rules block for AGENTS.md](https://ui.zazzy.studio/agents.md)
- [Registry index](https://ui.zazzy.studio/r/registry.json)
- [All docs in one file](https://ui.zazzy.studio/llms-full.txt)