Label

Use Label together with form control elements like input, select, checkbox, etc.

Examples

Required / Optional #

Use attribute required or optional if you need to indicate required / optional fields.

LabelLabel

Sizes #

Label supports the following sizes: xs, sm, md, lg, xl. The default size is md.

LabelLabelLabelLabelLabel

Associate label with form elements #

Label is important for accessibility of form elements.

LabelLabel
Associate chi-label with supported form-control web components

Help #

Use attribute infoIcon and infoIconMessage to include a help icon that displays helpful information in a popover.

Label
This HTML Blueprint requires JavaScript. You may use your own solution, or use Chi's vanilla JavaScript solution, Chi.js.

Web Component

Accessibility

Accessibility guidelines coming soon