Progress

Feedback · Guide 40 of 46

Open the live Progress demo →

Purpose

Determinate and indeterminate task progress.

Import

<script lang="ts">
	import { Progress } from 'bits-ui';
</script>

The registry names Progress as this guide’s namespace. Copy the exact root and part composition from the live demo rather than guessing part names.

Usage checklist

• Expose the state in text or semantics instead of color alone.
• Define loading, fallback, indeterminate, and failure behavior where relevant.
• Test slow updates, missing content, and reduced-motion preferences.

Secondary reference

After using the local example, consult the upstream Bits UI reference for exhaustive API details.

Continue

• Previous: Avatar
• Index: All component guides
• Next: Meter