Bonsai Design System

Label

Form field label built on Radix UI Label

Preview

Usage

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

<div className="space-y-2">
  <Label htmlFor="email">Email</Label>
  <Input id="email" type="email" placeholder="john@example.com" />
</div>

Automatically dims when the associated input is disabled via peer-disabled styling.

Install

npx shadcn add @bonsai/label

On this page