Circular Gauge / Use Cases / Apple Watch Rings

Blazor Circular Gauge Example - Apple Watch Rings

Loading Syncfusion Blazor Server Demos…

MOVE 65%
338/520 CAL

EXERCISE 43%
13/30 MIN

STAND 58%
7/12 HR

This sample resembles the visual appearance of Apple watch rings, functioning as an activity tracker that records movement, exercise, and standing metrics.

In this example, you can see how to style a circular gauge to emulate the Apple watch rings design. Key implementation details include:

  • Ranges with rounded corners for the distinctive ring appearance
  • Annotations to display move, exercise, and stand activity values
  • Circular layout representing daily activity goals and progress

More information on annotations can be found in this documentation section.

Transform your Blazor web apps today with Syncfusion® Blazor components
145+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE