Label

Notify me when tasks finish

Installation

pnpm dlx shadcn@latest add @paneui/label

Usage

import { Label } from "@/components/ui/label"

<Label htmlFor="email">Email</Label>

Examples

With Input

With Checkbox

Disabled

Disabled styles

Checkbox, Switch and Radio render a span with data-disabled, so the label matches it with has-data-disabled (wrapping) and peer-data-disabled (sibling; Checkbox and Switch carry the peer class) as well as the native has-disabled / peer-disabled.

API Reference

A font-medium text label laid out as a row with an 8px gap. It adds no props of its own. Also accepts every prop of label.