> ## Documentation Index
> Fetch the complete documentation index at: https://docs.cdp.coinbase.com/llms.txt
> Use this file to discover all available pages before exploring further.

# borderRadius

```ts theme={null}
const borderRadius: {
  badge: {
     value: "{borderRadius.full}";
  };
  banner: {
     value: "{borderRadius.lg}";
  };
  cta: {
     value: "{borderRadius.full}";
  };
  input: {
     value: "{borderRadius.sm}";
  };
  link: {
     value: "{borderRadius.full}";
  };
  modal: {
     value: "{borderRadius.sm}";
  };
  select: {
     trigger: {
        value: "{borderRadius.sm}";
     };
     list: {
        value: "{borderRadius.sm}";
     };
  };
  none: {
     value: 0;
  };
  xs: {
     value: "{font.size.base}";
     modify: {
        type: "multiply";
        value: 0.25;
     };
  };
  sm: {
     value: "{font.size.base}";
     modify: {
        type: "multiply";
        value: 0.5;
     };
  };
  md: {
     value: "{font.size.base}";
     modify: {
        type: "multiply";
        value: 0.75;
     };
  };
  lg: {
     value: "{font.size.base}";
     modify: {
        type: "multiply";
        value: 1;
     };
  };
  xl: {
     value: "{font.size.base}";
     modify: {
        type: "multiply";
        value: 1.5;
     };
  };
  full: {
     value: 99999;
  };
};
```

All the border radius tokens.

## Type declaration

| Name                       | Type                                                                                                | Default value           |
| -------------------------- | --------------------------------------------------------------------------------------------------- | ----------------------- |
| <a id="badge" /> `badge`   | \{ `value`: `"{borderRadius.full}"`; }                                                              | -                       |
| `badge.value`              | `"{borderRadius.full}"`                                                                             | `"{borderRadius.full}"` |
| <a id="banner" /> `banner` | \{ `value`: `"{borderRadius.lg}"`; }                                                                | -                       |
| `banner.value`             | `"{borderRadius.lg}"`                                                                               | `"{borderRadius.lg}"`   |
| <a id="cta" /> `cta`       | \{ `value`: `"{borderRadius.full}"`; }                                                              | -                       |
| `cta.value`                | `"{borderRadius.full}"`                                                                             | `"{borderRadius.full}"` |
| <a id="input" /> `input`   | \{ `value`: `"{borderRadius.sm}"`; }                                                                | -                       |
| `input.value`              | `"{borderRadius.sm}"`                                                                               | `"{borderRadius.sm}"`   |
| <a id="link" /> `link`     | \{ `value`: `"{borderRadius.full}"`; }                                                              | -                       |
| `link.value`               | `"{borderRadius.full}"`                                                                             | `"{borderRadius.full}"` |
| <a id="modal" /> `modal`   | \{ `value`: `"{borderRadius.sm}"`; }                                                                | -                       |
| `modal.value`              | `"{borderRadius.sm}"`                                                                               | `"{borderRadius.sm}"`   |
| <a id="select" /> `select` | \{ `trigger`: \{ `value`: `"{borderRadius.sm}"`; }; `list`: \{ `value`: `"{borderRadius.sm}"`; }; } | -                       |
| `select.trigger`           | \{ `value`: `"{borderRadius.sm}"`; }                                                                | -                       |
| `select.trigger.value`     | `"{borderRadius.sm}"`                                                                               | `"{borderRadius.sm}"`   |
| `select.list`              | \{ `value`: `"{borderRadius.sm}"`; }                                                                | -                       |
| `select.list.value`        | `"{borderRadius.sm}"`                                                                               | `"{borderRadius.sm}"`   |
| <a id="none" /> `none`     | \{ `value`: `0`; }                                                                                  | -                       |
| `none.value`               | `0`                                                                                                 | `0`                     |
| <a id="xs" /> `xs`         | \{ `value`: `"{font.size.base}"`; `modify`: \{ `type`: `"multiply"`; `value`: `0.25`; }; }          | -                       |
| `xs.value`                 | `"{font.size.base}"`                                                                                | `"{font.size.base}"`    |
| `xs.modify`                | \{ `type`: `"multiply"`; `value`: `0.25`; }                                                         | -                       |
| `xs.modify.type`           | `"multiply"`                                                                                        | `"multiply"`            |
| `xs.modify.value`          | `0.25`                                                                                              | `0.25`                  |
| <a id="sm" /> `sm`         | \{ `value`: `"{font.size.base}"`; `modify`: \{ `type`: `"multiply"`; `value`: `0.5`; }; }           | -                       |
| `sm.value`                 | `"{font.size.base}"`                                                                                | `"{font.size.base}"`    |
| `sm.modify`                | \{ `type`: `"multiply"`; `value`: `0.5`; }                                                          | -                       |
| `sm.modify.type`           | `"multiply"`                                                                                        | `"multiply"`            |
| `sm.modify.value`          | `0.5`                                                                                               | `0.5`                   |
| <a id="md" /> `md`         | \{ `value`: `"{font.size.base}"`; `modify`: \{ `type`: `"multiply"`; `value`: `0.75`; }; }          | -                       |
| `md.value`                 | `"{font.size.base}"`                                                                                | `"{font.size.base}"`    |
| `md.modify`                | \{ `type`: `"multiply"`; `value`: `0.75`; }                                                         | -                       |
| `md.modify.type`           | `"multiply"`                                                                                        | `"multiply"`            |
| `md.modify.value`          | `0.75`                                                                                              | `0.75`                  |
| <a id="lg" /> `lg`         | \{ `value`: `"{font.size.base}"`; `modify`: \{ `type`: `"multiply"`; `value`: `1`; }; }             | -                       |
| `lg.value`                 | `"{font.size.base}"`                                                                                | `"{font.size.base}"`    |
| `lg.modify`                | \{ `type`: `"multiply"`; `value`: `1`; }                                                            | -                       |
| `lg.modify.type`           | `"multiply"`                                                                                        | `"multiply"`            |
| `lg.modify.value`          | `1`                                                                                                 | `1`                     |
| <a id="xl" /> `xl`         | \{ `value`: `"{font.size.base}"`; `modify`: \{ `type`: `"multiply"`; `value`: `1.5`; }; }           | -                       |
| `xl.value`                 | `"{font.size.base}"`                                                                                | `"{font.size.base}"`    |
| `xl.modify`                | \{ `type`: `"multiply"`; `value`: `1.5`; }                                                          | -                       |
| `xl.modify.type`           | `"multiply"`                                                                                        | `"multiply"`            |
| `xl.modify.value`          | `1.5`                                                                                               | `1.5`                   |
| <a id="full" /> `full`     | \{ `value`: `99999`; }                                                                              | -                       |
| `full.value`               | `99999`                                                                                             | `99999`                 |