# Icon

Lucide, the one icon set: 24px grid, 1.75 stroke, round caps, shown at 16px (14px in chips and menus, 20px in empty states). Icons take the text colour and never stand alone without a label or tooltip.

- **Group:** Small primitives · **family:** `specimens` · **shadcn:** composed
- **Build:** `lucide-react` (already the shadcn icon library in components.json).
- **In apps/admin today:** lucide-react ^0.469.0 is installed.
- **Client component:** no. 

## Content rules

- Use the Lucide name shown in the list (`layers` = Global Store, `swatch-book` = Cloths…).

## Do

- Set `strokeWidth={1.75}` globally.

## Don't

- Mix another set or the retired hand-drawn `icons.py` glyphs.
- Fill an icon.

## Accessibility

- **ARIA:** Decorative icons: `aria-hidden="true"`.
- **ARIA:** Meaningful icon alone: the parent control carries `aria-label`.
- **Keyboard:** Icons are never focusable.
- **Focus:** None.

## Tokens

`--s-6` `--s-3` `--s-2` `--s-1` `--border` `--r-card` `--w-medium` `--text-small` `--font-voice` `--text-micro` `--muted-foreground` `--foreground` `--s-8` `--s-4`

## Files

`icon.html` live specimen · `icon.css` kit rules · `icon.d.ts` props · full page: `docs/components/icon/` (phone: `m/`).