--- title: Range slider desc: Range slider is used to select a value by sliding a handle. source: https://raw.githubusercontent.com/saadeghi/daisyui/refs/heads/master/packages/daisyui/src/components/range.css layout: components classnames: component: - class: range desc: For tag color: - class: range-neutral desc: neutral color - class: range-primary desc: primary color - class: range-secondary desc: secondary color - class: range-accent desc: accent color - class: range-success desc: success color - class: range-warning desc: warning color - class: range-info desc: info color - class: range-error desc: error color size: - class: range-xs desc: Extra small size - class: range-sm desc: Small size - class: range-md desc: Medium size default: true - class: range-lg desc: Large size - class: range-xl desc: Extra large size --- ### ~Range ```html ``` ### ~With steps and measure
| | | | |
1 2 3 4 5
```html
| | | | |
1 2 3 4 5
``` ### ~Neutral color ```html ``` ### ~Primary color ```html ``` ### ~Secondary color ```html ``` ### ~Accent color ```html ``` ### ~Success color ```html ``` ### ~Warning color ```html ``` ### ~Info color ```html ``` ### ~Error color ```html ``` ### ~Sizes
```html ``` ### ~Range with custom color and no fill ```html ```