UI Lab

    Progress

    Explore different variants and configurations of the Progress component.

    Progress

    Linear Progress
    Loading...33%
    Circular Progress
    25%

    Small

    50%

    Medium

    75%

    Large

    100%

    Complete

    Colored Circular Progress
    0%

    Primary

    0%

    Success

    0%

    Warning

    0%

    Error

    Ring/Donut Progress
    0percent
    0percent
    100percent
    Semi-circular & Indeterminate
    65%

    Semi-circular

    Indeterminate

    Spinner Icon

    Refresh Spin

    Styled Progress Bars
    Step Progress
    2
    3
    4
    System Indicators
    75%
    Contextual Progress Cards

    Downloading...

    project-assets.zip

    0%

    Uploading...

    3 of 5 files

    60%

    Storage Used

    7.5 GB of 10 GB

    Profile Completion

    4/5 steps