Radius
Each theme sets --ds-radius-base and the 5 steps are worked out from it, so the ratio between small and large is the same everywhere.
Steps
Base in this theme:
xs
sm
md
lg
xl
Values
| Token | Value |
|---|---|
--ds-radius-xs | calc(var(--ds-radius-base) * 0.25) |
--ds-radius-sm | calc(var(--ds-radius-base) * 0.5) |
--ds-radius-md | var(--ds-radius-base) |
--ds-radius-lg | calc(var(--ds-radius-base) * 1.5) |
--ds-radius-xl | calc(var(--ds-radius-base) * 2.5) |
--ds-radius-full | 999px |
Base by theme
| Theme | Base | |
|---|---|---|
| Core | 8px | |
| Condimental | 16px | |
| Dissonance | 3px | |
| Household | 14px | |
| Routine | 13px | |
| Specimen | 10px | |
| Parchment | 4px |