Label
Accessible form label that points at any control by its id, so clicking it focuses or toggles the control, with consistent typography across forms.
import { Label } from "@plexui/vue/components/Label";For stacked form fields, prefer Field: it bundles label, description, and error handling. Reach for a standalone Label when you pair it directly with a checkbox, switch, or any control where Field's layout is overkill.
Examples
Overview
Label in Field
API
Label
| Prop | Type | Default | Description |
|---|---|---|---|
for | string | id of the associated control. Clicks on the label focus or activate the control. | |
class | string | Applied to the root <label> element | |
| default slot | VNode[] | Label content |
Built on Reka UI Label, which prevents text selection on double-click and forwards clicks to the associated control. All other <label> attributes are forwarded.
Styling
Component tokens:
--label-color: text color (defaults to--color-text)--label-font-size: text size (defaults to--font-text-sm-size)--label-font-weight: weight (defaults to--font-weight-medium)--label-line-height: line height (defaults to1)