What Are Progress Dots Called in Apps and Websites?

The dots used to show movement through screens or steps are generally called progress indicators or progress dots. Their more specific name depends on the job they do: dots for switching between carousel slides are usually called pagination indicators, dots marking stages in a process are often called a step indicator or stepper, and animated dots that appear while something loads are called a loading indicator.

The general name: progress indicators

Progress indicator is the broad design term for a visual cue that tells someone about status or movement through a task. It can describe dots, a horizontal bar, a numbered sequence, a percentage, or another visual treatment. Progress dots are one form of indicator, not the name for every dotted control.

There is no single official label used by every design system or product team. A designer might call the same row of circles a progress tracker, step indicator, pagination control, or page indicator depending on its purpose. To identify the right term, ask what the dots communicate: completion of a task, the current position in a sequence, or ongoing activity.

That distinction matters in everyday conversation, too. If you are asking a developer to recreate dots beneath a slideshow, saying “carousel pagination dots” is clearer than saying only “progress dots.” If the dots show which stage of checkout a person has reached, “checkout step indicator” describes the function more accurately.

Pagination dots and carousel indicators

A row of small dots beneath a set of slides, photos, or cards is commonly called pagination dots, page indicators, or carousel indicators. One dot is usually emphasized to show which item is currently visible. Selecting another dot may take the user directly to its corresponding slide.

These dots show position within a collection, but they do not always represent progress toward finishing a task. A person looking at the second of five promotional slides is at position two of five; that does not necessarily mean they are 40 percent of the way through an activity. This is why pagination is often a more precise term than progress.

Carousel dots are useful when the number of slides is small enough for the dots to remain understandable. With a very long collection, a row of dozens of tiny circles can become difficult to scan or operate. Other controls, such as previous and next buttons, a visible item count, or a scrollbar, may communicate position more effectively.

Step indicators and steppers

When dots represent stages in a defined process, they are often described as a step indicator or stepper. Common examples include account setup, a checkout flow, an application form, or a sequence of instructions. The interface may distinguish the current step from completed and upcoming steps with color, size, a check mark, or a connecting line.

A stepper can use dots, but it may also show numbered circles and labels such as Shipping, Payment, and Review. In a compact mobile layout, the labels may be hidden to save space, leaving only the visual markers. The design should still make clear which step is active and, where relevant, which steps have been completed.

Unlike carousel pagination, a step indicator usually implies an ordered task. A user may need to complete the current stage before moving forward, and going backward might preserve or change previously entered information. The dots communicate the structure of the process, but they do not by themselves explain whether steps are optional, skippable, or reversible.

Loading dots and typing indicators

Dots that appear and animate while an app waits are usually called loading dots, a loading animation, or an indeterminate progress indicator. In a messaging interface, three animated dots may instead be called a typing indicator, because they suggest that another person or service is preparing a reply.

These indicators differ from step and page dots. A loading animation generally does not identify a particular screen or stage; it signals that work is happening when the exact completion time or amount of remaining work is not known. A determinate indicator, such as a bar labeled 60 percent, can show measured progress when the system has enough information to calculate it.

Animation alone should not be treated as proof that an operation is still working. If a wait can be lengthy, the interface should provide useful status information where possible, avoid leaving the user unsure whether the app has frozen, and explain what action is safe. For example, it may say that a file is uploading rather than showing dots with no context.

How the dots communicate status

Most progress-dot designs rely on a difference between the active marker and the others. The active dot might be darker, filled, larger, or surrounded by a visible outline. In a stepper, completed stages might have check marks while future stages remain unfilled. The exact visual convention varies, so color or shape should not be assumed to mean the same thing in every product.

For a fixed sequence, the interface can represent a current position and a total number of positions. A set of four carousel dots with the third emphasized communicates that the third item is active. A four-stage checkout stepper can communicate a similar position, but may also indicate which earlier tasks are complete. That extra meaning comes from the process, labels, and state styling—not simply from the number of dots.

Animated loading dots work differently: their changing pattern conveys activity rather than a stable location. Such an animation is generally called indeterminate because it does not provide a reliable numeric estimate of how much work remains. If the system can measure progress, a percentage or progress bar may be more informative than an animation alone.

Choosing the right pattern and wording

The best name and visual pattern depend on what the interface needs to tell the user. Before choosing dots, identify whether the sequence is a set of browsable items, a task with stages, or a wait for an operation. Then consider how many items there are and whether people need to jump directly between them.

Use pagination indicators for a small group of slides or pages when showing the current item is useful.
Use a step indicator for a multi-stage task where users benefit from knowing the stages and their current place.
Use a loading indicator when the app is busy; use a determinate bar or percentage if meaningful progress can be measured.
Consider another control when there are many items, when every item needs a descriptive label, or when users must navigate precisely.

Wording should match the user’s goal. A help document can call them “the dots under the carousel,” while a design specification can use “carousel pagination indicators.” For a form, “stepper” or “progress indicator” is usually clearer. Naming the purpose avoids confusion between navigation controls and status displays.

Accessibility and common usability problems

A row of tiny dots can be difficult to use if the dots are the only way to navigate. The clickable or tappable area should be large enough to target comfortably, even if the visible circle is small. Each control also needs a meaningful accessible name, such as “Go to slide 2,” rather than an indistinguishable label like “dot.” The current item should be exposed as current or selected to assistive technology.

Do not communicate the active state through color alone. A change in fill, outline, shape, or another visual cue can help people who have difficulty distinguishing colors. For a stepper, visible text labels can make the sequence easier to understand; for a carousel, a slide title or an accessible item description can supply useful context.

Motion deserves attention as well. Animated loading dots can distract some users, and not everyone can perceive animation in the same way. Interfaces should avoid using motion as the only signal that an operation is underway and should respect platform preferences for reduced motion where applicable. A static status message can provide information without requiring the user to interpret an animation.

Common problems include dots that are too small to select, too many dots to count, no indication of which one is active, and a row that looks interactive but cannot be used. Another source of confusion is using a stepper for a process whose stages are not actually sequential. If people can move freely among unrelated items, pagination or another navigation pattern may be a better fit.

Frequently Asked Questions

What are the dots under a slideshow called?
They are commonly called carousel indicators, pagination dots, or page indicators. They show which slide is active and may let a person jump to another slide.

Are progress dots the same as pagination dots?
Not always. Progress dots is a broad, informal description. Pagination dots usually mark a current page or slide, while a step indicator marks progress through a task with defined stages.

What are three dots that move while an app waits called?
They are usually called loading dots or an indeterminate loading indicator. In a chat, similar dots may be a typing indicator if they signal that someone is composing a message.

What is a row of dots in a checkout process called?
It is generally a step indicator or stepper. If it shows stages such as delivery, payment, and review, the dots communicate the user’s position in that ordered process.

Do progress dots show an exact percentage?
Usually not. A set of dots commonly shows a position or a rough stage, rather than a measured percentage. A percentage or determinate progress bar is more appropriate when the system can calculate how much work is complete.

Try it: the Date Difference Calculator: days, months, years and weekdays between two dates, with the DATEDIF formulas.

More in How-to basics

Sources: Function behaviour and menu paths: Microsoft Support documentation for Excel. Method & sources

Spotted an error in this guide? Let us know.