Skip to content

Component

Checkbox

A FormaUI checkbox — a themed binary selection control.

dev.formaui.components.checkbox

Preview

This toggle is site chrome only — the preview has its own light/dark switch inside.

Live preview

Live preview — ~37 MB development build

Usage

var checked by remember { mutableStateOf(true) }
Row(Modifier.toggleable(
    value = checked,
    role = Role.Checkbox,
    onValueChange = { checked = it },
)) {
    FormaCheckbox(checked = checked, onCheckedChange = null)
    Text("Enable notifications")
}

FormaCheckbox

A stateless binary selection control with hoisted checked state; pass onCheckedChange = null when an enclosing toggleable row owns the toggle.

checkedrequiredTypeBooleanDefaultrequiredDescriptionWhether the box is checked.
onCheckedChangerequiredType((Boolean) -> Unit)?DefaultrequiredDescriptionCalled with the new value when toggled, or null to make the checkbox non-interactive.
modifierTypeModifierDefaultModifierDescriptionThe Modifier applied to the checkbox.
enabledTypeBooleanDefaulttrueDescriptionWhether the checkbox is interactive.
colorsTypeCheckboxColors?DefaultnullDescriptionThe checkbox colors (defaults to the M3 defaults, themed by FormaTheme).
interactionSourceTypeMutableInteractionSource?DefaultnullDescriptionThe MutableInteractionSource for observing/emitting interactions. When null, one is remembered internally.

Accessibility

48dp touch target via Material 3's minimum interactive component size; when placing next to a label, prefer toggling from the row (Modifier.toggleable with Role.Checkbox) and pass onCheckedChange = null so the whole row is one accessible target.