Progress Rings
A row of gradient circular progress rings that sweep to their values with center readouts.
Resource usage
Current billing period
Live
0%
Storage
184 GB of 256
0%
Bandwidth
5.4 TB of 12
0%
Seats
22 of 25 active
0%
Compute
Cluster load
Updated moments ago4 of 4 within limits
Usage: paste this file into your project (e.g.
components/progress-ring-group.tsx), make sure framer-motion, clsx and tailwind-merge are installed, and add the cn() helper from the docs.