diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/dxc-progressbar.component.html b/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/dxc-progressbar.component.html
index fd78ad1c3..3b492be63 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/dxc-progressbar.component.html
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/dxc-progressbar.component.html
@@ -1,7 +1,7 @@
 <div class="progressContainer" [ngClass]="[overlay ? 'overlayed' : '']">
   <div class="backOverlay" *ngIf="overlay"></div>
   <div class="labelContainer" [ngClass]="[overlay ? '' : 'notOverlayed']">
-    <span class="label" *ngIf="label">{{ label }}</span>
+    <span class="label">{{ label }}</span>
     <span class="value" *ngIf="(value || value === 0) && showValue"
       >{{ value }}%</span
     >
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/dxc-progressbar.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/dxc-progressbar.component.ts
index 741e9a419..f4482156b 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/dxc-progressbar.component.ts
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/dxc-progressbar.component.ts
@@ -26,7 +26,6 @@ type Margin = {
   providers: [CssUtils],
 })
 export class DxcProgressbarComponent {
-
   /**
    * The value of the progress indicator. If it's received the component is determinate otherwise is indeterminate.
    */
@@ -35,7 +34,7 @@ export class DxcProgressbarComponent {
   /**
    * Text to be placed above the progress bar.
    */
-  @Input() label: string;
+  @Input() label: string = "";
 
   /**
    * Helper text to be placed under the progress bar.
@@ -84,20 +83,25 @@ export class DxcProgressbarComponent {
   constructor(private utils: CssUtils) {}
 
   public ngOnChanges(changes: SimpleChanges): void {
-    if (this.value || this.value === 0) {
-      if (this.value <= 100 && this.value >= 0) {
-        this.mode = "determinate";
-      } else {
-        if (this.value > 100) {
-          this.mode = "determinate";
-          this.value = 100;
-        } else if (this.value < 0) {
+    if (this.showValue) {
+      this.mode = "determinate";
+      if (this.value || this.value === 0) {
+        if (this.value <= 100 && this.value >= 0) {
           this.mode = "determinate";
-          this.value = 0;
         } else {
-          this.value = undefined;
-          this.mode = "indeterminate";
+          if (this.value > 100) {
+            this.mode = "determinate";
+            this.value = 100;
+          } else if (this.value < 0) {
+            this.mode = "determinate";
+            this.value = 0;
+          } else {
+            this.value = undefined;
+            this.mode = "indeterminate";
+          }
         }
+      } else {
+        this.value = 0;
       }
     } else {
       this.mode = "indeterminate";
@@ -117,7 +121,6 @@ export class DxcProgressbarComponent {
 
   public ngOnInit(): void {
     this.className = `${this.getDynamicStyle(this.defaultInputs.getValue())}`;
-
     if (this.value) {
       this.mode = "determinate";
     }
@@ -187,6 +190,8 @@ export class DxcProgressbarComponent {
         }
       }
       .helperText {
+        width: 80%;
+        z-index: 1;
         font-family: var(--progressBar-helperTextFontFamily);
         font-size: var(--progressBar-helperTextFontSize);
         font-style: var(--progressBar-helperTextFontStyle);
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/storybook/dxc-progressbar.stories.html b/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/storybook/dxc-progressbar.stories.html
new file mode 100644
index 000000000..e7ced3c9f
--- /dev/null
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/storybook/dxc-progressbar.stories.html
@@ -0,0 +1,99 @@
+<sb-example-container>
+  <sb-title title="Without labels" [level]="4"></sb-title>
+  <dxc-progressbar
+    [overlay]="false"
+    value="50"
+    [showValue]="true"
+  ></dxc-progressbar>
+</sb-example-container>
+
+<sb-example-container>
+  <sb-title title="With helperText" [level]="4"></sb-title>
+  <dxc-progressbar
+    helperText="Helper text"
+    [overlay]="false"
+    value="50"
+    [showValue]="true"
+  ></dxc-progressbar>
+</sb-example-container>
+
+<sb-example-container>
+  <sb-title title="Without default value" [level]="4"></sb-title>
+  <dxc-progressbar
+    label="Loading..."
+    [overlay]="false"
+    [showValue]="true"
+  ></dxc-progressbar>
+</sb-example-container>
+
+<sb-title title="Margins" [level]="2"></sb-title>
+<sb-example-container>
+  <sb-title title="Xxsmall margin" [level]="4"></sb-title>
+  <dxc-progressbar
+    label="Margin xxsmall"
+    margin="xxsmall"
+    [overlay]="false"
+    value="50"
+    [showValue]="true"
+  ></dxc-progressbar>
+</sb-example-container>
+<sb-example-container>
+  <sb-title title="Xsmall margin" [level]="4"></sb-title>
+  <dxc-progressbar
+    label="Margin xsmall"
+    margin="xsmall"
+    [overlay]="false"
+    value="50"
+    [showValue]="true"
+  ></dxc-progressbar>
+</sb-example-container>
+<sb-example-container>
+  <sb-title title="Small margin" [level]="4"></sb-title>
+  <dxc-progressbar
+    label="Margin small"
+    margin="small"
+    [overlay]="false"
+    value="50"
+    [showValue]="true"
+  ></dxc-progressbar>
+</sb-example-container>
+<sb-example-container>
+  <sb-title title="Medium margin" [level]="4"></sb-title>
+  <dxc-progressbar
+    label="Margin medium"
+    margin="medium"
+    [overlay]="false"
+    value="50"
+    [showValue]="true"
+  ></dxc-progressbar>
+</sb-example-container>
+<sb-example-container>
+  <sb-title title="Large margin" [level]="4"></sb-title>
+  <dxc-progressbar
+    label="Margin large"
+    margin="large"
+    [overlay]="false"
+    value="50"
+    [showValue]="true"
+  ></dxc-progressbar>
+</sb-example-container>
+<sb-example-container>
+  <sb-title title="Xlarge margin" [level]="4"></sb-title>
+  <dxc-progressbar
+    label="Margin xlarge"
+    margin="xlarge"
+    [overlay]="false"
+    value="50"
+    [showValue]="true"
+  ></dxc-progressbar>
+</sb-example-container>
+<sb-example-container>
+  <sb-title title="XxLarge margin" [level]="4"></sb-title>
+  <dxc-progressbar
+    label="Margin xxlarge"
+    margin="xxlarge"
+    [overlay]="false"
+    value="50"
+    [showValue]="true"
+  ></dxc-progressbar>
+</sb-example-container>
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/storybook/dxc-progressbar.stories.ts b/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/storybook/dxc-progressbar.stories.ts
new file mode 100644
index 000000000..b151a7a8e
--- /dev/null
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/storybook/dxc-progressbar.stories.ts
@@ -0,0 +1,31 @@
+import { ThemeModule } from "../../theme";
+import { DxcProgressbarComponent } from "../dxc-progressbar.component";
+import { DxcProgressbarModule } from "../dxc-progressbar.module";
+import { moduleMetadata, Meta, Story } from "@storybook/angular";
+import { ComponentsModule } from "../../../../.storybook/components/components.module";
+
+export default {
+  title: "Progressbar",
+  decorators: [
+    moduleMetadata({
+      imports: [DxcProgressbarModule, ComponentsModule, ThemeModule],
+    }),
+  ],
+} as Meta;
+
+const Progressbar: Story = (args) => ({
+  component: DxcProgressbarComponent,
+  templateUrl: "./dxc-progressbar.stories.html",
+  props: args,
+});
+
+const Overlay: Story = (args) => ({
+  component: DxcProgressbarComponent,
+  templateUrl: "./overlay-progressbar.stories.html",
+  props: args,
+});
+
+export const Chromatic = Progressbar.bind({});
+export const ProgressbarOverlay = Overlay.bind({});
+
+Chromatic.parameters = {};
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/storybook/overlay-progressbar.stories.html b/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/storybook/overlay-progressbar.stories.html
new file mode 100644
index 000000000..a7465e314
--- /dev/null
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-progressbar/storybook/overlay-progressbar.stories.html
@@ -0,0 +1,10 @@
+<sb-example-container>
+  <sb-title title="Overlay" [level]="4"></sb-title>
+  <dxc-progressbar
+    [overlay]="true"
+    value="50"
+    [showValue]="true"
+    label="Overlay"
+    helperText="Helper text"
+  ></dxc-progressbar>
+</sb-example-container>