Skip to main content

    ProgressBar

    Use the ProgressBar component to show your users that a system operation such as downloading, uploading, or processing is progressing. The ProgressBar can be used to visualize determinate or indeterminate progress.

    OverviewPropertiesUsage

    ProgressBar vs. ProgressCircle​

    An example of a ProgressBar component next to a ProgressCircle component. An example of a ProgressBar component next to a ProgressCircle component.

    ProgressBar​

    • Use the ProgressBar to indicate the state of an ongoing saving or uploading process. For example, when uploading a file from a user's device.

    ProgressCircle​

    • Use the ProgressCircle to indicate an ongoing loading process. For example, when loading results when users apply filters.

    ProgressBar vs. Skeleton​

    An example of a ProgressBar component next to a skeleton loading pattern. An example of a ProgressBar component next to a skeleton loading pattern.

    ProgressBar​

    • Use a ProgressBar to indicate that a specific part of a page has an ongoing saving or uploading process. It draws attention and should ideally be shown once at the same time.

    Skeleton​

    • Use Skeletons as a subtle indicator when your app is loading for the first time or if most parts of the page are loading.
    Still have questions?
    Find answers in the Dynatrace Community