🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

A small, smooth range input component with beautiful animation interaction.

Form React

Documentation

🎚 React Smooth Range Input

Tweet CircleCI Coverage Status npm downloads npm npm

  • Smooth input range
  • Beautiful animation interaction
  • Tiny size

Install

$ npm install react-smooth-range-input 

Example

https://react-smooth-range-input.now.sh

Quickstart

import react from 'react'; import Slider from 'react-smooth-range-input';  export default () => <Slider value={1} min={1} max={30} />;

Props

Prop Type Required Description
value number ✓ current value
min number ✓ min number range
max number ✓ max number range
onChange Function on value change callback
disabled boolean disable the component
hasTickMarks boolean = true show tick marks only apply to thick type
customController ({ ref: any, value: number }) => React.ReactNode custom controller: make sure to pass the ref

You May Also Like