DUSlider

Forms

Single-value range slider.

import { DUSlider } from 'deri-ui';
Live preview
Value55
typescript
<DUSlider defaultValue={40} showValue />

Props

PropTypeDefaultDescription
valuenumberControlled
min / max / stepnumberConstraints
showValuebooleantrueShow label

Usage

import { DUSlider } from 'deri-ui';

<DUSlider defaultValue={40} showValue />

Customize with className, radius, and Tailwind utilities. Theme tokens come from deri-ui/tailwind.preset.

© 2026 Deri Ui. Developed by Deribew Shimelis. Copy and use the code freely in your projects.