Skip to content
All effectsCharts

Ring Group

Three rings sweeping together, each to its own value.

Pure CSSChartsPro

Usage

70%50%85%

Meant for

Radial ChartMeterKPI Group

Examples

On a Card

Three rings sweeping one after the next, each to its own --wm-to. Each ring reads its target off its own element, so one class covers the whole group however many there are.

Goals
This month
70%Revenue50%Signups85%Retention

The class is wm wm-ring-group — the first half is the marker the trigger and reduced-motion rules hook into, the second is the effect.