<Label />

<Label htmlFor="email">Email</Label>
<Input id="email" type="email" />

<div className="space-y-4">
  <div className="flex items-center gap-2">
    <Label size="sm">Small Label</Label>
    <Input />
  </div>
  <div className="flex items-center gap-2">
    <Label size="default">Default Label</Label>
    <Input />
  </div>
</div>

<div className="space-y-4">
  <Label color="primary">Primary Label</Label>
  <Label color="success">Success Label</Label>
  <Label color="warning">Warning Label</Label>
  <Label color="danger">Danger Label</Label>
</div>

<div className="space-y-2">
  <Label htmlFor="required">
    Required Field <span className="text-danger-text">*</span>
  </Label>
  <Input id="required" required />
</div>

<div className="space-y-2">
  <Label htmlFor="username">Username</Label>
  <Input id="username" />
  <p className="text-sm text-muted">
    This will be your public display name.
  </p>
</div>

<div className="space-y-2">
  <Label htmlFor="disabled">Disabled Field</Label>
  <Input id="disabled" disabled />
</div>