Border Radius Tokens
Border radius tokens are used to give sharp edges a more subtle, rounded effect. They use rem units so they scale with the base font size. The pixel values displayed are based on a 16px font size.
Token | Value | Example |
---|---|---|
--sl-border-radius-small |
0.133rem (2px) | |
--sl-border-radius-medium |
0.333rem (5px) | |
--sl-border-radius-large |
0.667rem (10px) | |
--sl-border-radius-x-large |
1rem (15px) | |
--sl-border-radius-circle |
50% | |
--sl-border-radius-pill |
9999px |