Skip to content

Foundations

Foundations

Illustrations

System-aligned SVG artwork for empty states and docs. Prefer monochrome + primary tint — never emoji or loud gradients.

Usage

Import from @/components/docs/illustrations. Illustrations are decorative — pair with a clear title, body, and primary action.

Empty projects

First-use empty states for lists and workspaces

No results

Search and filter zero-states

Success

Completion moments and confirmations

Accessibility

Docs and education about inclusive UI

Composition

Keep illustrations under ~240px wide. They should support the message — not compete with the CTA.