Label
Renders an accessible label associated with controls.
<label class="label gap-3">
<input type="checkbox" class="input">
Accept terms and conditions
</label>Usage
Add the label class to your <label> element. Labels' style may be affected by the presence of a disabled peer or child element.
<label class="label" for="email">Your email address</label>Examples
Disabled
<div class="grid gap-3">
<label class="label" for="email">Email</label>
<input class="input" id="email" type="email" placeholder="Email" disabled>
</div>RTL
Labels support right-to-left layouts through native text flow. Add dir="rtl" to the label or an ancestor.
<div class="grid gap-3" dir="rtl">
<label class="label" for="email-rtl">البريد الإلكتروني</label>
<input class="input" id="email-rtl" type="email" placeholder="name@example.com">
</div>