Animated Progress Bar
A skill or progress bar that fills up with smooth animation.
Adjust the preview
Every choice updates the preview and the wording below.
Animation
Duration
Style
Label
Your prompt
Highlighted values follow your choices — click one to write your own.
Create an animated progress bar component. The bar fills from 0% to the target value with a smooth ease-out animation over 1.5 seconds. The bar style is gradient-filled bar with a percentage number on the right label. Trigger the animation when scrolled into view using Intersection Observer.
Paste it into Claude, Cursor, or v0 along with the context for your project.