# Radius and borders

> Corner radius and border width tokens.

Source: /docs/foundations/radius

To see how each `data-shape` value changes these tokens on real components, open the [Playground](/playground).

## Radius

| Utility | Value |
| --- | --- |
| `rounded-radius-radius-0` | 0px |
| `rounded-radius-radius-2` | 2px |
| `rounded-radius-radius-4` | 4px |
| `rounded-radius-radius-6` | 6px |
| `rounded-radius-radius-8` | 8px |
| `rounded-radius-radius-10` | 10px |
| `rounded-radius-radius-12` | 12px |
| `rounded-radius-radius-16` | 16px |
| `rounded-radius-radius-28` | 28px |
| `rounded-radius-radius-32` | 32px |
| `rounded-radius-radius-9999` | 9999px |

## Border width

| Utility | Value |
| --- | --- |
| `border-border-0` | 0px |
| `border-border-0-5` | 0.5px |
| `border-border-1` | 1px |
| `border-border-2` | 2px |
| `border-border-4` | 4px |