Skip to content
Holm Digital logotyp

Checkbox

A control that allows the user to select one or more options from a set. Built-in support for large touch targets and focus visibility.

The Checkbox component is designed to be highly visible and easy to interact with, even for users with motor impairments.

Accessibility Features

  • Label Association: Automatically links the hidden native input with the visual label via id and htmlFor.
  • Focus Ring: High-contrast focus ring that is visible even in High Contrast Mode.
  • Touch Target: Minimum 44x44px hit area to meet WCAG 2.1 Level AAA requirements.

Usage Example

import { Checkbox } from '@holmdigital/components'; <div className="flex items-center space-x-2"> <Checkbox id="terms" /> <label htmlFor="terms" className="text-sm font-medium leading-none"> Accept terms and conditions </label> </div>
Next →Introduction