---
id: Progress
section: components
cssPrefix: pf-c-progress
propComponents: ['Progress']
---

## Examples
### Basic
```ts file="./ProgressBasic.tsx"
```

### Small
```ts file="./ProgressSmall.tsx"
```

### Large
```ts file="./ProgressLarge.tsx"
```

### Outside
```ts file="./ProgressOutside.tsx"
```

### Inside
```ts file="./ProgressInside.tsx"
```

### Success
```ts file="./ProgressSuccess.tsx"
```

### Failure
```ts file="./ProgressFailure.tsx"
```

### Warning
```ts file="./ProgressWarning.tsx"
```

### Inside success
```ts file="./ProgressInsideSuccess.tsx"
```

### Outside failure
```ts file="./ProgressOutsideFailure.tsx"
```

### Single line
```ts file="./ProgressSingleLine.tsx"
```

### Without measure
```ts file="./ProgressWithoutMeasure.tsx"
```

### Failure without measure
```ts file="./ProgressFailureWithoutMeasure.tsx"
```


### Finite step
```ts file="./ProgressFiniteStep.tsx"
```

### Progress with step instructions
```ts file="./ProgressStepInstruction.tsx"
```

### Truncate title
```ts file="./ProgressTruncateTitle.tsx"
```

### Title outside of progress bar
```ts file="./ProgressTitleOutsideOfProgressBar.tsx"
```