Last Updated : 11 Jul, 2025
The HTML 5 <progress> Tag is used to represent the progress of a task. It is similar to an indicator that displays the progress of completing a task. It is not used to represent the disk space or relevant query.
Note: This tag is used in conjunction with JavaScript to display the progress of a task. The <progress> tag also supports the Global Attributes and Event Attributes in HTML.
<progress attributes...> </progress>Attributes
Attributes
Descriptions
It represents the total work that is to be done to complete a task.
It represents the amount of work that is already completed.
Example 1: In this example we will see the implementation of progress tag.
HTML
<!DOCTYPE html>
<html>
<body>
<h1>GeeksforGeeks</h1>
Downloading progress for a song:
<!--HTML progress tag starts here-->
<progress value="57"
max="100">
</progress>
<!--HTML progress tag ends here-->
</body>
</html>
Output:
Example 2: In this example we will see the implementation of progress tag.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<title>Progress Example</title>
<style>
body {
text-align: center;
padding: 50px;
font-family: Arial, sans-serif;
}
</style>
</head>
<body>
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h3>Task Progress</h3>
<progress value="50" max="100"></progress>
<p>50% Complete</p>
</body>
</html>
Output:
Supported BrowsersRetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4