Shaded Progress Bars: A CSS/Sass Exercise
In Tutorials by Rafael González
A tutorial on how to create some interesting 3D progress bars with CSS/Sass. Discover how to use box shadows and gradients to create realistic looking skins.
progress
Elastic Progress
In Playground by Lucas Bebber
An elastic SVG progress loader based on the Dribbble shot “Download” by xjw and implemented with SVG and TweenMax.
How to Create a Circular Progress Button
In Tutorials by Manoela Ilic
A tutorial on how to implement the circular progress button concept by Colin Garven. We are using the SVG line drawing animation technique as described by Jake Archibald to animate the circular progress and provide a success and error state to indicate the final status.
Progress Button Styles
In Playground by Manoela Ilic
A set of flat and 3D progress button styles where the button itself serves as a progress indicator. 3D styles are used for showing the progress indication on one side of the button while rotating the button in perspective.
