Delphi Design

Labels for form inputs with proper accessibility.

Usage

import { Label, Input } from "@delphi/ui";

export function Example() {
  return (
    <div className="space-y-2">
      <Label htmlFor="email">Email</Label>
      <Input id="email" type="email" />
    </div>
  );
}

API Reference

Prop	Type	Default	Description
`htmlFor`	`string`	-	ID of the associated form element
`className`	`string`	-	Additional CSS classes

Always use htmlFor to associate labels with inputs

Keep label text concise and descriptive

Position labels consistently — above or to the left of inputs

Use sentence case for label text

Include required field indicators when applicable

Use placeholder text as a substitute for labels

Hide labels for sighted users — they benefit everyone

Use all caps for labels — it reduces readability

Separate labels from their inputs visually