# Checkboxes

> Checkbox styles with checked, indeterminate, disabled and invalid states, plus chips, cards and nested groups.

- [Nested Checkbox](https://www.assembli.design/components/nested-checkbox.md): A checkbox tree for permissions and categories. Each parent shows checked, mixed or empty from the leaves beneath it, and ticking it selects or clears them all while leaving disabled ones alone. Branches fold open with a chevron and keep a running count. Only leaf ids live in the value.
- [Checkbox Cards](https://www.assembli.design/components/checkbox-cards.md): Whole cards that each work as one checkbox: an icon tile, title and description, with a round check that pops into the corner while the border takes the tone and the icon tile fills. Title is the accessible name, description is linked, four tones. Lay them in a grid for multi-select onboarding.
- [Chip Checkbox](https://www.assembli.design/components/chip-checkbox.md): A checkbox shaped like a filter chip. Checking it tints or fills the pill and slides a tick in from zero width, so neighbouring chips glide aside instead of jumping. Optional icon and result count, soft and solid variants, six tones and two sizes.
- [Glow Checkbox](https://www.assembli.design/components/glow-checkbox.md): A checkbox for polished product UI: a glassy box with a top highlight that, once checked, fills with a two-stop gradient, lights a soft halo and runs a sheen across the glass. Four gradients (cobalt, aurora, ember, iris) that read on light and dark backgrounds, plus a mixed state.
- [Brutalist Checkbox](https://www.assembli.design/components/brutalist-checkbox.md): A neo-brutalist checkbox: a thick square outline with a hard offset shadow. Hover lifts it, checking slams it into its shadow, floods it with a loud colour and stamps a heavy square-capped tick. Borders and shadows use your foreground colour, so it flips cleanly in dark mode. Five tones and a mixed state.
- [Tactile Checkbox](https://www.assembli.design/components/tactile-checkbox.md): A checkbox you can almost feel: a raised keycap in a recessed socket. Checking it latches the cap down, lights it in colour and engraves the tick; pressing sinks it the rest of the way. Unlit caps follow light and dark mode, lit caps come in blue, orange, green and graphite.
- [Ink Checkbox](https://www.assembli.design/components/ink-checkbox.md): A checkbox row that floods with ink from wherever you press it, flipping the text as the colour passes underneath, and drains back toward your next press. Keyboard toggles spread from the box. Optional description and a right-aligned price or count, in four tones.
- [Burst Checkbox](https://www.assembli.design/components/burst-checkbox.md): A checkbox that celebrates: ticking it squashes the box, fills it and throws a ring of sparks, like a like button. Only a person's own click bursts, so select-all and controlled updates fill quietly. Five tones, a mixed state, and a plain fill under reduced motion.
- [Morph Checkbox](https://www.assembli.design/components/morph-checkbox.md): A checkbox drawn as one continuous stroke: checking it unwinds the box outline and the same line runs on into a tick, then rewinds when unchecked. Pure CSS dash transitions, a tone you set with one variable, three sizes.
- [Round Checkbox](https://www.assembli.design/components/round-checkbox.md): A circular, reminders-style checkbox. Checking it pops the circle in on a spring, sends a ring outward and draws the tick; the mixed state shows a bar. Seven tones (blue, green, orange, red, violet, yellow, graphite) and an optional fade for finished tasks.
- [Classic Checkbox](https://www.assembli.design/components/classic-checkbox.md): The everyday checkbox, finished properly: a hairline box that firms up on hover, a primary fill with a tick that draws itself in, a dash for the mixed state, a press that gives, and invalid and disabled styles. Three sizes, an optional label and description, built on Base UI so it submits with forms.
- [Doodle Checkbox](https://www.assembli.design/components/checkbox-doodle.md): Hand-drawn checkbox: the box wobbles in as a sketchy outline, the tick is scribbled on with a stroke animation and the label gets struck through. Real input underneath, so forms and screen readers just work.

Back to [all components](https://www.assembli.design/components.md).
