Checkbox Group
A group component that manages a collection of checkboxes with shared state. Supports a 'Select all' checkbox with automatic indeterminate state, group-level disabled state, and two-way binding of selected values.
Default
A basic
CheckboxGroup with three items. Use @bind-Values for two-way binding of the selected values collection. Each CheckboxGroupItem requires a Value and displays a Label.Select All
Set
ShowSelectAll to true to display a "Select all" checkbox above the items. The select-all checkbox automatically shows an indeterminate state when only some items are selected. Customize the label with SelectAllLabel.Disabled
Set
Disabled on the group to disable all items. You can also disable individual items by setting Disabled on specific CheckboxGroupItem components.Custom Content
Use
ChildContent on CheckboxGroupItem instead of the Label parameter to render custom content next to the checkbox. This allows for richer layouts with descriptions, badges, or icons.Settings Card
A real-world settings card pattern using
CheckboxGroup with ShowSelectAll inside a Card. This replaces the need to manually manage individual checkbox states and "select all" logic.