Skip to content

Radius tokens

Radius tokens control how sharp or soft an interface surface feels. The scale progresses from none through bounded xs2xl corners; full is a deliberate capsule treatment rather than a generally rounded default.

none
xs
sm
md
lg
xl
2xl
full

Components consume semantic aliases such as --aidsgn-control-radius, --aidsgn-checkbox-radius, and --aidsgn-tag-radius. Prefer those roles when a component’s shape is part of its public visual contract. Use a primitive directly only for internal geometry without a semantic role.

Choose radius by purpose and surface size, not merely by available space. Controls in the same family should share a consistent shape, while passive tags and binary tracks may intentionally use the full pill radius.