A progress bar component can be used to visualize the current state (e.g., content loading, count down/up, etc) in the app and show your users the remaining time to wait before performing the next action.
In this blog post, you will find the 10 best and most downloaded Vue.js components to help developers create modern, customizable progress bars for web apps. Enjoy.
Originally published Oct 25, 2019, updated Mar 22, 2026
1. vue-wait
vue-wait helps to manage multiple loading states on the page without any conflict. It’s based on a very simple idea that manages an array (or Vuex store optionally) with multiple loading states. The built-in loader component listens its registered loader and immediately become loading state.
2. vue-ellipse-progress
Just another Vue.js component to create an elegant, animated, SVG based, circular progress bars.
3. Canvas Based Circle Progress Indicator – vue-awesome-progress
A simple, powerful, canvas-based circular progress indicator component for Vue.
4. vue-step-progress
A simple Vue component that displays a Progress Bar with labels for each step.
5. SVG Circle Progress Component For Vue 3
A lightweight yet highly customizable circle progress bar component for Vue 3.
6. Gradient Progress Bar Component For Vue 3
A beautiful, customizable progress (loading) bar component for Vue.js 3 applications.
7. Slim Progress Bar Plugin For Vue 3
A minimal Vue 3 progress bar plugin that supports multiple simultaneous progresses.
8. Customizable Radial (Circular) Progress Component For Vue 3
This is the Vue 3 version of wyzantinc’s vue-radial-progress, which enables you to generate radial progress bars with gradients and animations.
9. Responsive Circular Progressbar Component For Vue 3
A lightweight Vue 3 component for creating responsive, customizable, animated, circular progress bars with ease.
10. Step Progress Indicator In Vue
A simple yet customizable step progress indicator that can be used to indicate available steps in situations where the user has to fill a multi-step form.
Conclusion:
If you’re looking for more Vue.js components to visualize your numerical data, don’t forget to check out our Progress Bar section.
See Also:
- 10 Best Circular/Radial Progress Bar JavaScript Plugins
- 10 Best Progress Bar (Linear) Components In JavaScript & CSS (2020)
- 10 Best JavaScript & CSS Progress Bar Components (2020 Update)