Shapes

Radios de borde — una escala, no un valor único. Cada paso está atado a qué tipo de elemento lo usa, no es un número suelto para elegir a ojo.

xs4pxcheckbox

sm6pxtooltip

md8pxfield / menu / toast

lg12pxcard / panel

xl16pxmodal

2xl20pxsin uso todavía

full999pxpill

Pill

full está reservado para cápsulas — elementos donde el borde redondeado es parte de la identidad de la forma, no un detalle estético: OrbitButton, OrbitBadge, OrbitSwitch, OrbitAvatar, OrbitNavItem.

Button

Badge

Uso

.card {
  border-radius: var(--radius-lg);
}

Modifier.clip(RoundedCornerShape(DesignTokens.radiusLg.dp))

Referencia

Token (JSON)	CSS var	Kotlin (DesignTokens)	Valor	Uso
radius.xs	--radius-xs	radiusXs	4	checkbox
radius.sm	--radius-sm	radiusSm	6	tooltip
radius.md	--radius-md	radiusMd	8	field, menu, toast
radius.lg	--radius-lg	radiusLg	12	card, panel
radius.xl	--radius-xl	radiusXl	16	modal
radius.2xl	--radius-2xl	radius2xl	20	sin uso todavía
radius.full	--radius-full	radiusFull	999	pill (button, badge, switch, avatar, nav row)