Filament Material Theme

Appearance

See live

Checkbox ​

A Checkbox renders as a Material checkbox: an 18dp box with a 2dp outline, filling with the primary role when checked.

A checked checkbox with its labelA checked checkbox with its label
php
use Filament\Forms\Components\Checkbox;

Checkbox::make('subscribed');

Filament sizes the control from the type scale, which lands on 16dp; Material draws it at 18dp, where the 2dp outline takes a fifth of the box rather than a quarter.

States ​

StateWhat changes
CheckedFills with primary, mark on the on-primary role
IndeterminateThe same fill, with Filament's dash
FocusA 2dp primary ring, offset 2dp
DisabledThe outline drops to 38% of on-surface

List ​

A list of three checkbox options with the first checkedA list of three checkbox options with the first checked
php
use Filament\Forms\Components\CheckboxList;

CheckboxList::make('options')->options([
    'a' => 'Option A',
    'b' => 'Option B',
    'c' => 'Option C',
]);

Each option is a row with a state layer of its own, its label in body-large and its description in body-small on the variant ink. searchable() adds a message row that takes the same ink.