Skip to main content
Label
ImplementedForm control label with htmlFor binding and optional required marker (asterisk, aria-hidden, semantic-error color).
Categoryatoms
Source
src/components/atoms/Label/Label.tsxAI HintAlways pair with a form control id. Compose inside FormField rather than standalone where possible.
Form control label atom with htmlFor binding.
Label
design-system
Label component preview and API reference.
Props
Preview
Label
Prop
Type
Required
Default
Description
htmlForstringRequired
—id of the associated form control
requiredbooleanOptional
falseShow the required asterisk marker
Quick use:
<Label />Accessibility
ARIA rolelabel
ARIA
1 ruleUsage
Import
tsxSnippet
import { Label } from "@epasslive/design-system"Example 1
tsxSnippet
<Label htmlFor="email">Email</Label>Example 2
tsxSnippet
<Label htmlFor="email" required>Email</Label>Anti-patterns
— Never omit htmlFor — an unassociated label fails screen readers