loom muslin

Checkbox

Native checkbox with a muslin box visual; keyboard and screen-reader native.

Previewlive — edit controls below

Content

State

Basic

import { Checkbox } from "@loom/muslin-react";

<Checkbox defaultChecked>Remember this customer</Checkbox>

In a form

Label, default state, and a disabled option.

import { Checkbox, Label } from "@loom/muslin-react";

<Label htmlFor="notify">Notifications</Label>
<Checkbox defaultChecked>Email me a receipt</Checkbox>
<Checkbox disabled>Notify the accounting team (admin only)</Checkbox>

Select all

import { Checkbox } from "@loom/muslin-react";

<Checkbox indeterminate onChange={(checked) => selectAll(checked)}>
  Select all invoices
</Checkbox>