MenuCaderno UI
npmGitHub
Theme

<cad-checkbox>

Checkbox

Select independent options. Supports checked, unchecked, and indeterminate states.

Checklist states

API reference: <cad-checkbox>

checkedcheckedbooleanfalsedisableddisabledbooleanfalsehinthintstring''indeterminateindeterminatebooleanfalselabellabelstring''namenamestring''requiredrequiredbooleanfalsetonetoneCadCheckboxTone'blue'valuevaluestring'on'checkedbooleancheckedyesdisabledbooleandisabledyeshintstringhintnoindeterminatebooleanindeterminatenolabelstringlabelnonamestringnameyesrequiredbooleanrequiredyestoneCadCheckboxTonetoneyesvaluestringvaluenoinputEventFired when the user toggles the checked state.changeEventFired after the checked state changes.labelVisible control label. Falls back to the `label` attribute.hintSupporting text. Falls back to the `hint` attribute.baseNative label wrapping the control.boxHand-drawn checkbox frame.controlNative checkbox input.hintSupporting text.labelVisible label.markCheck mark.--cad-checkbox-bgPer-instance selected background.--cad-checkbox-inkPer-instance control color.

Accessibility

The text label toggles the checkbox. Space toggles it from the keyboard; required enables native validation. Only checked values are submitted.

MIT licensed. Built with Caderno UI.Report an issue
Back to top