Radio

Radios are single-selectable form control groups. Radio Design Guidelines.

Edit the code below to see your changes live!

API

Supports all native <input /> element attributes.

Radio

Prop Name
Type
Default
Description
label *string | RadioLabel

Label to display next to a Radio component.

descriptionstring | RadioDescription

See below for usage.

Props ending with * are required

Radio[RadioDescription]

Prop Name
Type
Default
Description
text *string

Description to display below Label

linkRadioDescriptionLink

See below for usage.

Props ending with * are required

Prop Name
Type
Default
Description
externalboolean

Shows an external icons when the external flag is set and target="_blank".

hrefstring

Same as a HTML anchor href attribute.

textstring

Link text to display.

targetstring

Same as a HTML anchor target attribute.

Props ending with * are required

Grouping

In order to group radio controls, use the Fieldset component to separate the controls.

First Group
Second Group

Edit the code below to see your changes live!

Description

Radio support description passed as a prop, which contains a text and an optional link.

Description for on

Description for off

Description for disabled. Learn more

Edit the code below to see your changes live!

Beta