Demo and API docs
##<paper-radio-button>
Material design: Radio button
paper-radio-button
is a button that can be either checked or unchecked.
User can tap the radio button to check or uncheck it.
Use a <paper-radio-group>
to group a set of radio buttons. When radio buttons
are inside a radio group, exactly one radio button in the group can be checked
at any time.
Example:
<paper-radio-button></paper-radio-button>
<paper-radio-button>Item label</paper-radio-button>
Styling
The following custom properties and mixins are available for styling:
Custom property | Description | Default |
---|
--paper-radio-button-unchecked-background-color | Radio button background color when the input is not checked | transparent |
--paper-radio-button-unchecked-color | Radio button color when the input is not checked | --primary-text-color |
--paper-radio-button-unchecked-ink-color | Selected/focus ripple color when the input is not checked | --primary-text-color |
--paper-radio-button-checked-color | Radio button color when the input is checked | --primary-color |
--paper-radio-button-checked-ink-color | Selected/focus ripple color when the input is checked | --primary-color |
--paper-radio-button-size | Size of the radio button | 16px |
--paper-radio-button-label-color | Label color | --primary-text-color |
--paper-radio-button-label-spacing | Spacing between the label and the button | 10px |
This element applies the mixin --paper-font-common-base
but does not import paper-styles/typography.html
.
In order to apply the Roboto
font to this element, make sure you've imported paper-styles/typography.html
.