Border radius

T-shirt-sized border radius tokens. Per the Figma spec, chips and FABs use $radius-2xl; dialogs use $radius-md.

@use '@presencelearning/styles/borders' as b;

.chip {
  border-radius: b.$radius-2xl;
}
.dialog {
  border-radius: b.$radius-md;
}
.pill {
  border-radius: b.$radius-full;
}

The domain also exports the aggregate $radius map and a get($size) function for dynamic lookups:

.dynamic {
  border-radius: b.get(md);
}

$radius-none 0

$radius-xs 2px

$radius-sm 4px

$radius-md 8px

$radius-lg 12px

$radius-xl 16px

$radius-2xl 28px

$radius-full 9999px