# Label

Form label with consistent spacing and optional required marker.

## Pure Owl component

```js
import { Label } from "@thebase/ui";
```

```base-ui
<div style="max-width: 28rem" class="w-100">
  <div class="d-flex align-items-center gap-2">
    <Checkbox/>
    <Label for="'terms'">Accept terms and conditions</Label>
  </div>
</div>
```

| Component | Prop | Type | Notes |
| --- | --- | --- | --- |
| `Label` | `for` | `String` | optional |
| `Label` | `required` | `Boolean` | optional |
| `Label` | `className` | `String` | optional |

See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.

## Static component

```base-ui
<label b-ui="label" b-att-required="true" for="email">Email</label>
```

Options: `b-att-required="true"`.

Accessibility: use `for` with the matching control `id`.