CheckboxCard

Introduction

A checkbox within a card layout, ideal for options that require additional context. If you need a standard checkbox or a checkbox styled as a button, you can use the regular Checkbox instead.

Interactive demo

Try the interactive demo below to explore the checkboxcard component.

Usage

• Use checkboxcards for options that require additional context or explanation.
• Use checkboxcards when users need to select multiple items from a list.
• Use checkboxcards when the changes aren't happening immediately, but rather when a form is submitted. If you need the change to happen immediately, consider using a SwitchCard or Switch instead.

Indeterminate checkbox

Indeterminate checkboxcards represent a mixed state when only some items in a group of checkboxes are selected. It is not a third selecable choice, but should represent a mixed state.

Labels

Use clear and descriptive labels that accurately convey the purpose of the checkbox.