Label Element

The Label element is a semantic text component specifically designed for form fields, ensuring accessibility and clear user guidance.

Live Preview

Label Preview

Specifications

Labels provide semantic context to your input elements:

  • Field Linkage: Use the HTML For property to associate the label with an input's ID, improving accessibility.
  • Semantic Structure: Rendered as a standard HTML label tag for better screen-reader support.
  • Styling Hooks: Apply custom weights, colors, and tracking to match your site globally.
  • Layout Integration: Pair easily with any Input Elements to build structured forms.

AI Guidance

How to prompt for Labels:

  • Add a bold label for the email input field.
  • Create a required label that says 'Message *'.
  • Insert a small, muted label for the optional phone number field.