VOOZH about

URL: https://www.geeksforgeeks.org/css/spectre-sliders/

⇱ Spectre Sliders - GeeksforGeeks


  • Courses
  • Tutorials
  • Interview Prep

Spectre Sliders

Last Updated : 23 Jul, 2025

Sliders are used to drag a handle to select a numeric value. The sliders are for selecting values from ranges. You can add the tooltip class to have tooltip labels. If no data-tooltip is set, the value can be used instead. 

Spectre Sliders Class:

  • slider: This class is used to create sliders.

Syntax:

<input class="slider" type="..." 
 min="..." max="..." value="...">

Example 1: In this example, we will create a simple slider.

Output: 

👁 Image
Spectre Sliders

Example 2:  In this example, we will create a simple tooltip slider.

Output:

👁 Image
Spectre Sliders

Reference:  https://picturepan2.github.io/spectre/experimentals/sliders.html

Comment