Label

Label is a thin wrapper around the native <label> element. It dims automatically when its peer input is disabled.

Installation

Terminal

pnpm dlx shadcn@latest add https://faber-ui.vercel.app/r/label.json

Usage

typescript

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

export default function Example() {
  return (
    <div className="flex flex-col gap-1">
      <Label htmlFor="email">Email</Label>
      <Input id="email" type="email" />
    </div>
  );
}