Label

Label component for form elements. Renders an accessible label element associated with form controls.

1. Import

Import the label component from the design system.

import { Label } from "@/design-system/components/ui/label"

2. Props

Label component props.

Prop	Type	Default
className	string	--
htmlFor	string	--
children	ReactNode	--

3. Usages

Common label patterns with form elements.

import { Label } from "@/design-system/components/ui/label";
import { Input } from "@/design-system/components/ui/input";

export function Example() {
  return (
    <div className="grid gap-2">
      <Label htmlFor="email">Email</Label>
      <Input id="email" placeholder="Enter your email" />
    </div>
  );
}