CircularProgressIndicator Component Playground

Interactive playground to test all CircularProgressIndicator props and variants

Props

Progress25%

0%25%50%75%100%

Quick Set

Size

Auto-animate

Progress: 25%

Size: medium

Animated: No

Code

<CircularProgressIndicator progress={25} size="medium" />

Props (JSON)

{
  "progress": 25,
  "size": "medium"
}

Examples

Progress States

25%

50%

75%

100%

All Sizes (50% progress)

Small

Medium

Large