Design Tokens
A comprehensive reference of all design tokens used throughout the Common Origin design system.
Border
| Token Name | Value | Usage | Example |
|---|---|---|---|
| border.default | 0.0625rem solid #e9ecef | Standard component borders | Sample |
| border.subtle | 0.0625rem solid #dee2e6 | Subtle dividers and separators | Sample |
| border.strong | 0.0625rem solid #343a40 | Emphasized borders | Sample |
| border.focus | 0.125rem solid #343a40 | Focus indicators | Sample |
| border.tooltip | 0.125rem dotted #dee2e6 | Tooltip borders | Sample |
Border Radius
| Token Name | Value | Example |
|---|---|---|
| border.radius.none | 0 | Sample |
| border.radius.xs | 0.125rem | Sample |
| border.radius.sm | 0.25rem | Sample |
| border.radius.md | 0.5rem | Sample |
| border.radius.lg | 0.75rem | Sample |
| border.radius.xl | 1rem | Sample |
| border.radius.2xl | 1.5rem | Sample |
| border.radius.3xl | 2rem | Sample |
| border.radius.circle | 10rem | Sample |