Design system
The panel design system now has its own section in the docs navigation. Start with the design-system overview for the principles and the relationship between shared tokens, React components and product patterns.
Detailed reference
Section titled “Detailed reference”FoundationsSource-derived light/dark colours, typography, spacing, corners and icons.
ComponentsShared React APIs, button variants, fields, feedback and overlays.
Layout and dataApplication shell, responsive pages, charts, lists and console patterns.
States and accessibilityLifecycle mapping, request states, permissions, contrast and keyboard access.
ImplementationSource files, token mapping, composition and verification.
Shared brand and website
Section titled “Shared brand and website”The panel, website and docs share their fonts and semantic tokens. The panel uses compact Lucide controls and neutral interaction colours; the website adds pixel icons, isometric illustrations and larger display typography. Detailed website and asset rules remain in the contributor design notes.
This address remains available for existing bookmarks. Use /docs/design-system/ for new links to the panel reference.