Skip to content
garn

Your agent reads garn natively.

garn's judgment layer — when to use what, do/don'ts, the keyboard and labelling behaviour of each component, and composition recipes across all of them — is structured data, not prose. An agent queries it instead of guessing from training data, and audits its own output before you ever see it.

Set up the MCP server if your client speaks it. This page is the layer underneath — what it serves, and how to read it when your tools only take text.

Hand it the setup

Installing garn is agent-runnable end to end. Paste one of these into your coding agent — it installs garn, wires the theme, then reads .garn/rules.md and queries the MCP (or the hosted corpus) before it composes anything.

agent prompt

Set up garn (https://garn.ohuba.com) in this project. 1. Run: npx garn-ui init --yes 2. Check that the garn-theme.css import landed in the global stylesheet. 3. Add components: npx garn-ui add <names> (npx garn-ui list shows the roster). 4. Before writing UI, read .garn/rules.md and query the garn MCP: garn_search to find, garn_view + garn_get_examples to learn, garn_audit to check your work. No MCP? Fetch https://garn.ohuba.com/llms-full.txt.

The rules file in your repo

garn init writes .garn/rules.md — a generated, version-matched rules file: how to discover components before writing, the token and accessibility rules, and the full roster. Abridged:

.garn/rules.md (abridged)
# Using garn — rules for AI tools

garn is a Radix + Tailwind v4 design system copied into this project as source you own.

## 1. Discover before you write — don't invent APIs
- Query the garn MCP for component knowledge: garn_search · garn_view ·
  garn_get_examples · garn_match_recipe · garn_relations · garn_audit.
  No MCP? Read the hosted /llms-full.txt instead.
- The props/types ground truth is the copied source in components/ui/.
- Missing a component? npx garn-ui add <id> before importing it.

## 2. Semantic tokens, never raw values
## 3. Accessibility is non-negotiable
## 4. Compose via documented slots

## Component roster
(86 components, grouped by category)

Keep it in every agent session by importing it from your agent's memory file:

CLAUDE.md
@.garn/rules.md
AGENTS.md
Before writing any UI, read .garn/rules.md and follow it.

No MCP? Read the corpus

The same metadata is served flat for tools that just read text: /llms.txt (the index) and /llms-full.txt (the full corpus — every component's usage, props, accessibility, and recipes).

What your agent gets

Intent, not just props

What each component is for, when to reach for it over a neighbour, and the do/don'ts that keep a composition sound.

The whole anatomy

Every slot, subcomponent, and styling axis — so the agent composes through the public API instead of inventing one.

Behaviour it can check its work against

Keyboard models, focus rules, and the labels a component needs — so garn_audit catches a broken composition before you see it.

The same behaviour, written for humans, on Foundations → Accessibility.