The progress dots display an animation to indicate the user is waiting for content to load or an action to complete.

Example

⌘ Cmd + ⌥ Option + 1

Properties

propertypropTyperequireddefaultdescription
testSectionstring--Hook for automated JavaScript tests

Usage

Prefer using progress dots when multiple loading indicators are needed on a single page. Spinner is great for a single view, whereas progress dots is useful for loading multiple pieces of information (like on the Results page) or in a small space UI space.

Best Practices

Do

Prefer using progress dots to multiple Spinners

Don't

Avoid overloading the page with more than 4-5 of these (consider grouping the loading indicators together into a single element)