edge-components

Range Default 

<div><input type="range" class="range" min="0" max="100" value="40" />

    <input type="range" class="range" min="0" max="100" value="40" />

</div>
 
<div>
  @!jrmc.form.input({ type: 'range', min: 0, max: 100, value: 40 })
  @!jrmc.form.range({ min: 0, max: 100, value: 40 })
</div>
  • Handle: @range-default
  • Preview:
  • Filesystem Path: fractal/components/03-form/05-range/01-range-default.edge

Range slider

Doc : daisyui range slider

Range slider is used to select a value by sliding a handle.

Class name Type
range Component For input range
range-primary Modifier Adds primary color to range
range-secondary Modifier Adds secondary color to range
range-accent Modifier Adds accent color to range
range-lg Responsive Large range
range-md Responsive Medium range(default)
range-sm Responsive Small range
range-xs Responsive Extra small range