Open experiment
Labeled toggle switch
A small toggle control for binary preferences using a native button, aria-pressed state, and adjacent explanatory content.
Lab tested Responsive Dark mode Interactive
- Version
- 1.0.0
- Updated
- 2026-08-02
- Dependencies
- Zero
<div class="cmp-switch">
<div><strong>Live preview</strong><span>Refresh the component while editing</span></div>
<button type="button" aria-pressed="true"><span aria-hidden="true"></span><b>On</b></button>
</div>
No runtime reactions detected Open in Editor
Validated in the lab
Experiment report
- Schema and source files passed
- Responsive test passed
- Keyboard test passed
- No console errors
Component ingredients
- Dependencies
- None
- Browser support
- Current Chrome, Current Edge, Current Firefox, Current Safari
- Version
- 1.0.0
- Last tested
- 2026-08-02
Accessibility notes
- Uses a native button.
- State is exposed with aria-pressed.
- Text explains the preference.
License: MIT License for open-source use, modification, and distribution.