Radius

Corner radii from Foundation — use keys, not raw pixels.

Corners are Foundation keys (roundedLarge, roundedXXLarge). roundedCircle is the pill / full round.

Scale

Token	Value
roundedNone	0
roundedXSmall	2px
roundedSmall	4px
roundedMedium	6px
roundedLarge	8px
roundedXLarge	12px
roundedXXLarge	16px
roundedCircle	9999px

roundedNone0

roundedXSmall2px

roundedSmall4px

roundedMedium6px

roundedLarge8px

roundedXLarge12px

roundedXXLarge16px

roundedCircle9999px

Usage

<Box
  padding="sizeLarge"
  radius="roundedXLarge"
  border="strokeWidthThin"
  borderColor="borderDefault"
  background="backgroundSurface"
>
  Rounded surface
</Box>