diff --git a/docs/src/pages/components/ProgressBar.svx b/docs/src/pages/components/ProgressBar.svx
index cd5e4c85..f70f6f01 100644
--- a/docs/src/pages/components/ProgressBar.svx
+++ b/docs/src/pages/components/ProgressBar.svx
@@ -3,66 +3,70 @@
import Preview from "../../components/Preview.svelte";
+`ProgressBar` provides a visual indicator of progress for operations such as file uploads or data processing. It supports determinate and indeterminate states, various sizes, and status indicators.
+
## Default
-Without a specified `value` prop, the progress bar is indeterminate.
+Create an indeterminate progress bar that continuously animates.
## Small size
-Specify `size="sm"` to use the small variant.
+Use the small size variant for compact layouts.
## Percentage
-Specify a `value` for the progress bar to be determinate.
+Display progress as a percentage using the `value` prop.
## Finished status
-Specify `status="finished"` for the progress bar.
+Show completion status with a checkmark icon.
## Error status
-Specify `status="error"` for the progress bar.
+Indicate errors with an error icon and red styling.
## Custom max value
-The default `max` value is `100`.
+Set a custom maximum value for the progress bar.
## Hidden label
-It's recommended that you provide a `labelText` for accessibility.
-
-Use `hideLabel` to visually hide the label text.
+Visually hide the label while maintaining accessibility.
## Inline variant
-The inline variant visually hides the `helperText`.
+Use the inline variant to display progress without helper text.
## Indented variant
+Use the indented variant for a more compact layout.
+
## Indented status variant
+Combine the indented variant with status indicators.
+
## UX example
-This example shows how to animate the progress bar from 0 to 100% with start and end states.
+Demonstrate a complete upload flow with start and end states.
\ No newline at end of file