# Label

Form label linked to its field for screen readers, with an error style that can flicker once and turn red when the field rejects its value.

> Primitive · Free · Forms & Inputs — React Native, Expo Go compatible.

## Install

```bash
npx @lumioui/cli add label
```

## Import

```tsx
import { Label } from "@/components/ui/label/label";
```

## Props

| Prop | Type | Notes |
| --- | --- | --- |
| `htmlFor?` | `string` | Id this label answers to — applied as the label's own nativeID so a  control can name it via `accessibilityLabelledBy`/`aria-labelledby`:  `<Label htmlFor="email">Email</Label>` + `<Input accessibilityLabelledBy="email" />`.  (RN has no htmlFor→focus wiring; the association is the shared id.) |
| `id?` | `string` | Explicit id for the label node (maps to nativeID, and the DOM id on web). |
| `nativeID?` | `string` | Own nativeID — wins over id/htmlFor when several are set. |
| `error?` | `boolean` | Muted/destructive error variant. |
| `flicker?` | `boolean` | Opt-in Lumio refusal: when `error` turns on, the label flickers once (dips to 0.6, released on the flicker spring) while its ink shifts foreground → destructive over 250ms; clearing shifts back with no flicker. Off by default — the label then switches tone instantly. |
| `className?` | `string` | NativeWind classes. |

Source: https://lumioui.com/components/label