Foundations
Border Width
Stroke-width tokens for borders and focus rings. Semantic widths (interactive, selected, focus, supportive, none) reference the core width ramp.
Core
| Token | Value | Preview |
|---|---|---|
--moments-core-border-width-0 | 0rem = 0px | |
--moments-core-border-width-50 | 0.031rem = 0.5px | |
--moments-core-border-width-100 | 0.063rem = 1.01px | |
--moments-core-border-width-200 | 0.125rem = 2px | |
--moments-core-border-width-400 | 0.25rem = 4px | |
--moments-core-border-width-800 | 0.5rem = 8px |
Semantic → core
| Semantic token | Points to (core) | Resolved value | Preview |
|---|---|---|---|
--moments-semantic-border-width-none | --moments-core-border-width-0 | 0rem = 0px | |
--moments-semantic-border-width-interactive | --moments-core-border-width-100 | 0.063rem = 1.01px | |
--moments-semantic-border-width-supportive | --moments-core-border-width-50 | 0.031rem = 0.5px | |
--moments-semantic-border-width-selected | --moments-core-border-width-200 | 0.125rem = 2px | |
--moments-semantic-border-width-focus | --moments-core-border-width-200 | 0.125rem = 2px |