Skip to main content

Icons

Icons in the Axon design system are custom 24×24 glyphs organised into semantic categories. Most icons ship in outlined and filled variants; the filled variant is typically used for selected or active states.

Figma source: Icons live in the Assets library under Published icons. All icons are 24 × 24, use fg/primary fill colour, and have a single Vector path with no groups or strokes.

Usage guidelines

  • Use the outlined variant as the default; switch to filled only for active, selected, or toggled states.
  • Icons should always be paired with a visible label or accessible aria-label — never used alone without context.
  • Render icons at 24 × 24 px. Scale to 20 × 20 for compact / dense UI contexts.
  • Apply colour via the fg/ token layer (fg/primary, fg/secondary, fg/disabled, etc.) so icons respond to light/dark mode automatically.

Icon library

Search by name or filter by category. Click any tile to copy the icon name to your clipboard.