Label
Installation
Run the following command
npx vibes@latest add label
Usage
'use client';import * as React from 'react';import { Label } from '@/vibes/soul/form/label';function Usage() { const id = React.useId(); return ( <fieldset> <Label htmlFor={id}>First name</Label> <input id={id} /> </fieldset> );}
API Reference
This component uses the Label component from Radix UI. Refer to the Label documentation for more information.
Additional Props
Prop | Type | Default |
---|---|---|
colorScheme | 'light' | 'dark' | 'light' |
CSS Variables
This component supports various CSS variables for theming. Here's a comprehensive list.
:root { --label-light-text: var(--contrast-500); --label-dark-text: var(--contrast-100);}