sm

6px

use: Chips, Small badges, Meter segments

avoid: Buttons or inputs — use md; mixing sm/md/lg in one component reads as unfinished

md

8px

use: Buttons, Inputs

avoid: Cards or panels — use xl

lg

10px

use: Nav items, Inline links

avoid: Cards or panels — use xl; this step is the unstyled `--radius` base, reserved for small nav affordances

xl

14px

use: Cards, Panels — the most common surface radius

avoid: Buttons or chips — too soft, loses precision on small controls

full

9999px

use: Avatars, Pill buttons, Toggles, Meter bars

avoid: Rectangular content containers like cards or panels