Slider

Range input element

import { Slider } from 'theme-ui'

<Slider defaultValue={25} />
<Slider defaultValue={25} />

Variants

Slider variants can be defined in the theme.forms object. The Slider component uses theme.forms.slider as its default variant style.

// example theme variants
{
  forms: {
    slider: {
      // adjust default styles here
    },
    redSlider: {
      color: 'red',
    },
  },
}