# Icon
> Generated from icon.contract.json — do not edit by hand.

One glyph set, called by name — 259 icons imported from Figma, rendered by the shared <aha-icon>, never inline SVG.

Tier: **leaf-lit**. Frameworks: HTML (paste-and-run, no build step) · React · Vue 3.

Surfaces: editor, dashboard, settings, audience.

## Props
| Prop | Type | Default | Notes |
| --- | --- | --- | --- |
| `name` | string | `—` | Registry glyph name, e.g. system-bell, slidetype-poll, filetype-course |
| `size` | 12 | 16 | 24 | 32 | `24` | On-grid pixel size; the master stroke scales with it |
| `label` | string | `—` | Accessible name (role=img). Omit for a decorative icon |
| `decorative` | boolean | `false` | aria-hidden — for an icon that only repeats adjacent text |

## Visual standard (measured)
- Set: 259 glyphs · system · slide-type · file-type
- Source: Figma Design System V3 · node 50699-7126
- Sizes: 12 · 16 · 24 · 32 (only)
- Colour: currentColor / semantic token (254 recolorable)
- State: outline = neutral · -filled asset = active

## When to use
- **system-* glyph** — the default for all product-UI chrome, buttons, menus, list rows, status
- **-filled asset** — a selected/active/on state — e.g. system-bookmark-simple-filled; a solid glyph survives greyscale
- **slide-type / file-type** — labelling a slide kind or a file kind; file-type glyphs keep their baked brand colour

Call by name from the registry — never inline an <svg>, never pull a second icon set (Lucide/Heroicons/FontAwesome/@ant-design/icons). Off-grid sizes (no 20px) aren't supported. Icon-only buttons need an aria-label (and a tooltip when the meaning isn't obvious). If a glyph is genuinely missing, add the SVG under icons/svg and re-run build-icons.mjs.
