# ProgressBar (/docs/products/dash-dots/reference/components/progress-bar)

Use it when you know how far along something is, such as an upload. When you don't, use a `Spinner`.

**Children:** Nothing

## Example

![The ProgressBar component](/assets/images/dash-dots/components/progress-bar.webp)

```xml title="view.dml"
<View gap="small">
  <Text variant="caption" tone="muted">Uploading, 60%</Text>
  <ProgressBar value="60" />
</View>
```

## Props

| Prop    | Type     | What it is                          |
| ------- | -------- | ----------------------------------- |
| `value` | `number` | How far along it is, from 0 to 100. |

## Events

None.