Etiqueta visible que describe un control de formulario y se asocia al input
vía for (en JSX, htmlFor). Hace dos cosas: explica
al usuario qué se le está pidiendo y aumenta el área de tap del control.
Nunca lo reemplaces por un placeholder.
Default
El label vive solo, sin asociación — útil dentro de cards informativas o headers de grupo.
Con input
El uso normal: label arriba, input debajo, asociados por for/id.
Tap sobre el label enfoca el input.
Con asterisco (required)
Para campos obligatorios, agrega un asterisco rojo después del texto. Si la mayoría son obligatorios, marca solo los opcionales con la palabra (opcional).
Disabled
Cuando el input está disabled, el label se atenúa al 70% vía
peer-disabled:opacity-70. El input lleva la clase peer
y debe ir antes del label en el DOM para que el selector
funcione (en este ejemplo invertimos el orden visual con flex).
Estado theme: ⚠ pendiente verificar.