Your bookmarks

Radio

Enables users to pick exactly one option from a group.

With all of the choices that go into planning a trip, decision fatigue can overtake even the most seasoned traveler. Simplify the process for your users by presenting them with clear, well-defined choices.

Radios make it clear that only one option in a form can be selected. Make sure you add enough context so users have everything they need to make an informed decision.

Component status

Figma
Released
Web (React)
Released
iOS (Swift)
n/a
Android (Kotlin)
n/a
Sketch
Released

Component structure

Label: works best when short; radio controller: indicates the state and can be selected or not; info text: adds more explanation to the label and can contain a link.