Label

Accessible label for form controls.

inputs

form

accessibility

label

Preview

Your email

Variants

Default label for input fields.

Your email

Code

TSX

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

export function LabelDemo() {
  return (
    <div className="grid gap-1.5">
      <Label htmlFor="email">Email</Label>
      <Input type="email" id="email" placeholder="Email" />
    </div>
  )
}

API Reference

Prop	Type	Default	Description
htmlFor	string	-	Associates the label with a form control.
disabled	boolean	-	Whether the label is disabled.

View Full Documentation