Element of
Semantic Markup
What does <progress> do?
The <progress> element is used to create a progress bar to serve as a visual demonstration of progress towards the completion of task or goal. The max and value attributes are used to define how much progress (value) has been made towards task completion (max).

Code Example

<progress value="33" max="100"></progress>

Showing Progress

<progress> is a new semantic element in HTML 5. Use it to display a progress bar when a file is being uploaded, or your progress towards a fundraising goal.

Is Your Progress 'Task-Related'?

The HTML 5 specification says we should use <progress> when displaying the completion of a specific task.

If you need to show a result for something that is not related to a task, you should use <meter>.

Browser Support for progress