Activity Rings Card

Apple Watch-style concentric goal rings - move, exercise, and running progress with hoverable ring focus and stat tiles below. Pairs with the Most Active Days card to show any selected day.

Activity

Move
1,592 kcal
Exercise
1h 45m
Running
5.2 km

Installation

Activity Rings Card is part of BoardUI Pro.

Dark mode ready - this component follows BoardUI semantic tokens automatically. Set up theme switching.

Pro access

Activity Rings Card is a Pro component.

Your BoardUI Pro license unlocks this component and all of its source files. Activate your license once, then install it directly into your project with the CLI.

01

Activate your license

Use the key from your Lemon Squeezy purchase email. You only need to do this once per machine.

npx boardui@latest login YOUR_LICENSE_KEY
02

Install the component

The CLI copies the source and resolves every BoardUI and npm dependency for you.

npx boardui@latest add activity-rings-card

This component is included in BoardUI Pro

Get BoardUI Pro now and install it end away.

Using a shared UI package or custom import aliases? Configure your installation paths before running the CLI. Copy-paste examples use the default imports.