Progress — 100 CSS effects

Progress bars, rings, meters, and completion indicators.

Pure CSS with no dependencies or build step. Open any effect for a live preview, source code, and browser editing.

Page 2 of 2

A neumorphic groove pressed into a soft slab, holding a raised pill and a slowly breathing marker.

A jagged discharge path where the charged section is stroked bright and keeps sparking unevenly.

A frosted glass panel floating over coloured light, with a specular streak gliding across it.

A hairline gradient halo turns forever around a static value arc that holds forty six percent.