Skip to content

CanonOration design system

Get started

Overview
Principles
Using Canon
Repository
Component lifecycle
For agents

Brand

Brand identity
Voice and tone
Writing

Foundations

Design tokens
Color
Typography
Spacing
Layout
Responsive
Shape
Elevation
Motion
Iconography
Illustration
Theming
Accessibility
Interaction states
Styles and utilities

Components

All components

Patterns

Loading, empty and error
Forms and validation
Saving and unsaved changes
Destructive actions
Feedback and undo
Navigation and wayfinding
Search, filter and sort
Selection and bulk actions
AI assistance
Education and onboarding
Keyboard and commands
Permissions and availability
Live and running states
Labels and icons that change

Templates

Document page
Home
List page
Record page
Settings page
Three-pane workspace
Builder canvas
Sign in and account

llms.txt for agents
Back to workspace

Canon
All components

All components

Every Canon component by atomic level, category and status, with live adoption counts.

PreviousStyles and utilities NextAgent avatar