Theme: Light | Lightest | Dark | Darkest Scale: Medium | Large

Checkbox Group

Usage notes

Checkbox groups are used to group checkbox fields.

Default

Quack

Woof

Meow


    <coral-checkboxgroup aria-label="Animals">
      <coral-checkbox name="r1">Quack</coral-checkbox>
      <coral-checkbox name="r1">Woof</coral-checkbox>
      <coral-checkbox name="r1">Meow</coral-checkbox>
    </coral-checkboxgroup>

Vertical

Toggle markup


    <coral-checkboxgroup orientation="vertical" aria-label="Numbers">
      <coral-checkbox name="r2">1</coral-checkbox>
      <coral-checkbox name="r2">2</coral-checkbox>
      <coral-checkbox name="r2">3</coral-checkbox>
    </coral-checkboxgroup>