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
Custom VMs From 1 to 96 vCPUs With 99.95% Uptime Icon
Custom VMs From 1 to 96 vCPUs With 99.95% Uptime

General-purpose, compute-optimized, or GPU/TPU-accelerated. Built to your exact specs.

Live migration and automatic failover keep workloads online through maintenance. One free e2-micro VM every month.
Try 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