Radio

Form radio input component

import { Radio } from 'theme-ui'

<Label>
  <Radio
    name='dark-mode'
    value='true'
    defaultChecked={true}
  />
  Dark Mode
</Label>
<Label>
  <Radio
    name='dark-mode'
    value='false'
  />
  Light Mode
</Label>
<Label>
  <Radio
    name='dark-mode'
    value='true'
    defaultChecked={true}
  />
  Dark Mode
</Label>
<Label>
  <Radio
    name='dark-mode'
    value='false'
  />
  Light Mode
</Label>

Variants

Radio variants can be defined in theme.forms and the component uses the theme.forms.radio variant by default.