Radio API
Import
Props
value
(required)
The value of the radio.
Type: string
size
The size variant of the radio.
Type: 'small' | 'large'
color
The color variant of the radio when it is checked.
Type: 'primary' | 'secondary' | 'error' | 'info' | 'warning' | 'success'
className
Additional class names for extending styles.
Type: string
label
(required)
The label of the radio.
Type: string
labelClassName
Additional class names for extending styles of the label.
Type: string
CSS Variables
You can customize the style of <Radio />
component by using the following CSS
variables (custom properties):
CSS Classes
.radio
The base styles for <Radio />
component.
.radio--disabled
Styles for the disabled
state.
.radio--primary
Styles for the primary
color variant.
.radio--secondary
Styles for the secondary
color variant.
.radio--error
Styles for the error
color variant.
.radio--info
Styles for the info
color variant.
.radio-warning
Styles for the warning
color variant.
.radio--success
Styles for the success
color variant.
.radio--small
Styles for the small
size variant.
.radio--large
Styles for the large
size variant.
.radio__inner
The base styles for the input
element.
.radio__icon
The base styles for the icon element. It is responsible for displaying the icons when the radio is checked or not.