Responsive and slick progress bars with animated SVG paths. Use built-in shapes or create your own paths. Customize the animations as you wish. With ProgressBar.js, it's easy to create responsive and stylish progress bars for the web. Animations perform well even on mobile devices. It provides a few built‑in shapes like Line, Circle and SemiCircle but you can also create custom shaped progress bars with any vector graphic editor. ProgressBar.js is lightweight, MIT licensed and supports all major browsers including IE9+. A simple code example of creating a Line shaped progress bar and animating it from 0% to 100%. ProgressBar.js uses shifty tweening library to animate path drawing. So in other words, animation is done with JavaScript using requestAnimationFrame. Animating with JS gives more control over the animation and is supported across major browsers. For example IE does not support animating SVG properties with CSS transitions.

Features

  • Line progress bar animation
  • Circle progress bar animation
  • Semi-circle progress bar animation
  • Custom progress bar animation
  • Animated SVG paths
  • Use built-in shapes or create your own paths

Project Samples

Project Activity

See All Activity >

License

MIT License

Follow ProgressBar.js

ProgressBar.js Web Site

Other Useful Business Software
MongoDB Atlas runs apps anywhere Icon
MongoDB Atlas runs apps anywhere

Deploy in 115+ regions with the modern database for every enterprise.

MongoDB Atlas gives you the freedom to build and run modern applications anywhere—across AWS, Azure, and Google Cloud. With global availability in over 115 regions, Atlas lets you deploy close to your users, meet compliance needs, and scale with confidence across any geography.
Start Free
Rate This Project
Login To Rate This Project

User Reviews

Be the first to post a review of ProgressBar.js!

Additional Project Details

Programming Language

JavaScript

Related Categories

JavaScript User Interface (UI) Software

Registered

2021-07-26