Skip to content

Component

RadioButton

A FormaUI radio button — a themed control for choosing one option from a set.

Themed defaults48dp target

import dev.formaui.components.radiobutton.FormaRadioButton

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

KOTLIN
val options = listOf("Standard", "Priority", "Overnight")var selected by remember { mutableStateOf(options.first()) }Column(Modifier.selectableGroup()) { options.forEach { option -> Row(Modifier.selectable( selected = option == selected, role = Role.RadioButton, onClick = { selected = option }, )) { FormaRadioButton(selected = option == selected, onClick = null) Text(option) } }}

FormaRadioButton

A stateless single-choice control with hoisted selected state; group several with Modifier.selectableGroup() and pass onClick = null when the row owns selection.

selectedrequiredTypeBooleanDefaultrequiredDescriptionWhether this option is the selected one in its group.
onClickrequiredType(() -> Unit)?DefaultrequiredDescriptionCalled when this option is clicked, or null to make the radio button non-interactive.
modifierTypeModifierDefaultModifierDescriptionThe Modifier applied to the radio button.
enabledTypeBooleanDefaulttrueDescriptionWhether the radio button is interactive.
colorsTypeRadioButtonColors?DefaultnullDescriptionThe radio button 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; apply Modifier.selectableGroup() to the container so screen readers announce the set and position (e.g. "2 of 4"), and prefer row-level Modifier.selectable with onClick = null so the whole row is one accessible target.