VOOZH about

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

⇱ Spectre Progress - GeeksforGeeks


  • Courses
  • Tutorials
  • Interview Prep

Spectre Progress

Last Updated : 23 Jul, 2025

A progress bar is used to display the progress of a process. A progress bar helps us to visualize how much of the process is complete and how much is left. Spectre Progress is used to create a similar bar to display the progress.

Spectre Progress Class:

  • progress: This class is used to create a progress layout.

Syntax:

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

Example 1: We can use progress class on the input element as well. In this example, we will create the same.

Output:

👁 Image
Spectre Progress

Example 2: The following demonstrates 2 progress bars showing the progress completion task.

Output:

👁 Image
Spectre Progress

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

Comment