Radio button
A radio button is a user-interface control for selecting one option from a group of mutually exclusive choices.
Build Python Web Apps with Streamlit
st.radio is a Streamlit selection element that lets a user choose one value from a set of options.
- How it is used
- Builds a single-choice control for Streamlit interfaces, such as selecting a quantity before showing related units.
- How deep it goes
- Defines selection behavior, demonstrates basic placement, and lists customization options without examining widget internals.
- Examples
- Uses Mass, Length, and Time choices in a unit-converter quantity selector, including a sidebar variant.
- What you can do after
- Apply it via Streamlit to capture one selected option and use that value in subsequent interface logic.
Read how Build Python Web Apps with Streamlit explains radio button →
Tiny CSS Projects
A radio button is a form control that lets a user select one option from a group of mutually exclusive choices.
- How it is used
- Uses radio buttons for a Yes/No choice in a contact form and as a case for styling native form controls.
- How deep it goes
- Works through native color changes, an appearance reset, sizing, and the inner disk; leaves radio-group behavior unexplained.
- Examples
- Shows a contact form’s Yes/No input, an accent-colored native control, and a custom circular control.
- What you can do after
- Operates/configures radio-button appearance with CSS, choosing a quick color change or a custom control that scales with text.
React Quickly, Second Edition
A radio button is an HTML input control representing one mutually exclusive choice within a group.
- How it is used
- Uses radio buttons to select a single task priority in a React form.
- How deep it goes
- Explains static values, checked state, shared names, and change updates, but stops short of deeper browser internals.
- Examples
- Demonstrates four priority choices and a reusable Radio component for an add-task form.
- What you can do after
- Build it from scratch as a controlled React priority selector that stores the selected value in state.
Read how React Quickly, Second Edition explains radio button →
Build a Website with ChatGPT
A radio button is a form control that lets a user select one option from a group of mutually exclusive choices.
- How it is used
- Uses mutually exclusive form choices for event sign-ups, surveys, quizzes, feedback, and registrations.
- How deep it goes
- Explains appearance, selection behavior, group sizing, legends, initial choices, and submitted name/value attributes without descending into advanced implementation.
- Examples
- Demonstrates event days, T-shirt sizes, an initially selected Medium option, and a submitted Saturday value.
- What you can do after
- Apply it via HTML and ChatGPT prompts to create short single-choice form groups with labels, initial selections, and submitted values.
Read how Build a Website with ChatGPT explains radio button →
Related concepts
- accent-colorconfigured by · The CSS accent-color property specifies the accent color used by supported user-interface controls and form elements.
- Streamlitused by · Streamlit is an open-source Python framework for building interactive web applications, particularly for data and machine-learning applications.
- configurationconfigured by · A specification of settings, parameters, or component relationships that determines how a system, application, model, or process is structured or operates.
- checked propertyuses · The checked property is a form-control property that reports whether a checkbox input is selected.
- form fieldkind of · A form field is a user-interface control or component that represents data to be entered or selected in a form, often with associated rendering or validation behavior.
- widgetkind of · A widget is a self-contained user-interface component that displays information or provides a focused interaction.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.