diff --git a/playground/entries/ProgressBar.tsx b/playground/entries/ProgressBar.tsx
index de7da825a4..dd378c0205 100644
--- a/playground/entries/ProgressBar.tsx
+++ b/playground/entries/ProgressBar.tsx
@@ -23,8 +23,8 @@ const entry: PlaygroundEntry<NSProgressBar.Props> = {
     },
     theme: {
       type: 'select',
-      value: 'invert',
-      options: ['invert', 'dark'],
+      value: 'default',
+      options: ['default', 'invert'],
       displayName: 'Theme',
     },
     duration: {
diff --git a/semcore/progress-bar/__tests__/progress-bar.axe-test.ts b/semcore/progress-bar/__tests__/progress-bar.axe-test.ts
index a6d6b98c4a..c83e216781 100644
--- a/semcore/progress-bar/__tests__/progress-bar.axe-test.ts
+++ b/semcore/progress-bar/__tests__/progress-bar.axe-test.ts
@@ -16,4 +16,11 @@ test.describe(`@progress-bar ${TAG.ACCESSIBILITY}`, () => {
     const violations = await getAccessibilityViolations({ page });
     expect(violations).toEqual([]);
   });
+
+  test('All themes on light and dark backgrounds', async ({ page }) => {
+    await loadPage(page, 'stories/components/progress-bar/advanced/examples/all_themes.tsx', 'en');
+
+    const violations = await getAccessibilityViolations({ page });
+    expect(violations).toEqual([]);
+  });
 });
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx
index 732fcd267a..08ed8fbee6 100644
--- a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx
+++ b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx
@@ -1,44 +1,60 @@
 import { expect, test } from '@semcore/testing-utils/playwright';
+import type { Page } from '@semcore/testing-utils/playwright';
 import { loadPage } from '@semcore/testing-utils/shared/helpers';
 import { TAG } from '@semcore/testing-utils/shared/tags';
 
+const BAR_EXAMPLE = 'stories/components/progress-bar/tests/examples/customizing_the_bar_with_background.tsx';
+const VALUE_EXAMPLE = 'stories/components/progress-bar/tests/examples/customizing_the_value.tsx';
+
+/** The example is mounted into `#root`, so snapshots are scoped to it instead of the whole viewport. */
+const stand = (page: Page) => page.locator('#root');
+
+/**
+ * `default` and `invert` are the built-in themes; any other value falls through
+ * to the custom-theme path, so one custom token is covered alongside them.
+ */
+const THEMES = ['default', 'invert', 'violet-100'];
+const SIZES = ['s', 'm', 'l'];
+/** One boundary value per size, so each snapshot also covers a distinct edge case. */
+const BOUNDARY_VALUE_BY_SIZE = { s: 1, m: 99, l: 110 } as const;
+
+const themeSizeMatrix = THEMES.flatMap((theme) =>
+  SIZES.map((size) => ({
+    theme,
+    size,
+    value: BOUNDARY_VALUE_BY_SIZE[size as keyof typeof BOUNDARY_VALUE_BY_SIZE],
+  })),
+);
+
 /* =====================================================
 @visual
 Visual states, hover and focus styles, paddings, margins, and snapshots.
 ===================================================== */
 test.describe(`${TAG.VISUAL}`, () => {
-  const variablesBarCustomization = [
-    { theme: 'invert', size: 's', value: 0 },
-    { theme: 'dark', size: 'm', value: 110 },
-    { theme: 'violet-100', size: 'l', value: 50 },
-  ];
-  variablesBarCustomization.forEach((item) => {
+  // Every case renders the theme on both light and dark backgrounds, across
+  // value=<case>, value=0, value=100 and the no value state.
+  themeSizeMatrix.forEach((item) => {
     test(`Verify progress bar with background customization with value=${item.value}, size=${item.size}, theme=${item.theme}`, {
       tag: [TAG.PRIORITY_HIGH, '@progress-bar'],
     }, async ({ page }) => {
-      await loadPage(page, 'stories/components/progress-bar/tests/examples/customizing_the_bar_with_background.tsx', 'en', item);
+      await loadPage(page, BAR_EXAMPLE, 'en', item);
 
       await test.step('Verify progress bar visual with keyboard focus', async () => {
         await page.keyboard.press('Tab');
-        await expect(page).toHaveScreenshot();
+        await expect(stand(page)).toHaveScreenshot();
       });
     });
   });
 
-  const variablesValueCustomization = [
-    { value: 0, theme: 'inviolet-500', size: 's' },
-    { value: 110, theme: 'violet-100', size: 'm' },
-    { value: 50, theme: 'violet-100', size: 'l' },
-  ];
-  variablesValueCustomization.forEach((item) => {
+  themeSizeMatrix.forEach((item) => {
     test(`Verify progress bar value customization with value=${item.value}, size=${item.size}, theme=${item.theme}`, {
       tag: [TAG.PRIORITY_HIGH, '@progress-bar'],
     }, async ({ page }) => {
-      await loadPage(page, 'stories/components/progress-bar/tests/examples/customizing_the_value.tsx', 'en', item);
+      await loadPage(page, VALUE_EXAMPLE, 'en', item);
 
       await test.step('Verify progress bar value visual with keyboard focus', async () => {
         await page.keyboard.press('Tab');
-        await expect(page).toHaveScreenshot();
+        await expect(stand(page)).toHaveScreenshot();
       });
     });
   });
@@ -48,6 +64,13 @@ test.describe(`${TAG.VISUAL}`, () => {
   }, async ({ page }) => {
     await loadPage(page, 'stories/components/progress-bar/docs/examples/customizing_the_bar.tsx', 'en');
     await page.keyboard.press('Tab');
-    await expect(page).toHaveScreenshot();
+    await expect(stand(page)).toHaveScreenshot();
+  });
+
+  test('Verify all themes on light and dark backgrounds', {
+    tag: [TAG.PRIORITY_HIGH, '@progress-bar'],
+  }, async ({ page }) => {
+    await loadPage(page, 'stories/components/progress-bar/advanced/examples/all_themes.tsx', 'en');
+    await expect(stand(page)).toHaveScreenshot();
   });
 });
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-all-themes-on-light-and-dark-backgrounds-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-all-themes-on-light-and-dark-backgrounds-1-chromium-linux.png
new file mode 100644
index 0000000000..fede0091f0
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-all-themes-on-light-and-dark-backgrounds-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-all-themes-on-light-and-dark-backgrounds-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-all-themes-on-light-and-dark-backgrounds-1-firefox-linux.png
new file mode 100644
index 0000000000..684f1117e1
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-all-themes-on-light-and-dark-backgrounds-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-all-themes-on-light-and-dark-backgrounds-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-all-themes-on-light-and-dark-backgrounds-1-webkit-linux.png
new file mode 100644
index 0000000000..2dfc5cb115
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-all-themes-on-light-and-dark-backgrounds-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-both-value-and-progress-bar-customized-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-both-value-and-progress-bar-customized-1-chromium-linux.png
index 598a5c4440..ca8dd08844 100644
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-both-value-and-progress-bar-customized-1-chromium-linux.png and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-both-value-and-progress-bar-customized-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-both-value-and-progress-bar-customized-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-both-value-and-progress-bar-customized-1-firefox-linux.png
index 17f2a0bbc2..a4eb325e12 100644
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-both-value-and-progress-bar-customized-1-firefox-linux.png and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-both-value-and-progress-bar-customized-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-both-value-and-progress-bar-customized-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-both-value-and-progress-bar-customized-1-webkit-linux.png
index e080b1e73c..27f292d353 100644
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-both-value-and-progress-bar-customized-1-webkit-linux.png and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-both-value-and-progress-bar-customized-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-0-size-s-theme-inviolet-500-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-0-size-s-theme-inviolet-500-1-chromium-linux.png
deleted file mode 100644
index 1a1b6be335..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-0-size-s-theme-inviolet-500-1-chromium-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-0-size-s-theme-inviolet-500-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-0-size-s-theme-inviolet-500-1-firefox-linux.png
deleted file mode 100644
index 25bd145314..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-0-size-s-theme-inviolet-500-1-firefox-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-0-size-s-theme-inviolet-500-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-0-size-s-theme-inviolet-500-1-webkit-linux.png
deleted file mode 100644
index 5ca0c9b09c..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-0-size-s-theme-inviolet-500-1-webkit-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-default-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-default-1-chromium-linux.png
new file mode 100644
index 0000000000..d1d091121d
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-default-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-default-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-default-1-firefox-linux.png
new file mode 100644
index 0000000000..efaf9e27dd
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-default-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-default-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-default-1-webkit-linux.png
new file mode 100644
index 0000000000..f0381daac2
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-default-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-invert-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-invert-1-chromium-linux.png
new file mode 100644
index 0000000000..d1d091121d
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-invert-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-invert-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-invert-1-firefox-linux.png
new file mode 100644
index 0000000000..efaf9e27dd
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-invert-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-invert-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-invert-1-webkit-linux.png
new file mode 100644
index 0000000000..f0381daac2
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-invert-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-violet-100-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-violet-100-1-chromium-linux.png
new file mode 100644
index 0000000000..7d06626c20
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-violet-100-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-violet-100-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-violet-100-1-firefox-linux.png
new file mode 100644
index 0000000000..22a63523ee
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-violet-100-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-violet-100-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-violet-100-1-webkit-linux.png
new file mode 100644
index 0000000000..2b3cad58b0
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-1-size-s-theme-violet-100-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-default-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-default-1-chromium-linux.png
new file mode 100644
index 0000000000..50347ee6a8
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-default-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-default-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-default-1-firefox-linux.png
new file mode 100644
index 0000000000..d2be1c6c32
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-default-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-default-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-default-1-webkit-linux.png
new file mode 100644
index 0000000000..362a347451
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-default-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-invert-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-invert-1-chromium-linux.png
new file mode 100644
index 0000000000..50347ee6a8
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-invert-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-invert-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-invert-1-firefox-linux.png
new file mode 100644
index 0000000000..d2be1c6c32
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-invert-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-invert-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-invert-1-webkit-linux.png
new file mode 100644
index 0000000000..362a347451
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-invert-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-violet-100-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-violet-100-1-chromium-linux.png
new file mode 100644
index 0000000000..5abc9886a5
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-violet-100-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-violet-100-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-violet-100-1-firefox-linux.png
new file mode 100644
index 0000000000..d412c4fa3e
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-violet-100-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-violet-100-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-violet-100-1-webkit-linux.png
new file mode 100644
index 0000000000..13c3f57e8f
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-l-theme-violet-100-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-m-theme-violet-100-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-m-theme-violet-100-1-chromium-linux.png
deleted file mode 100644
index a463ada205..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-m-theme-violet-100-1-chromium-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-m-theme-violet-100-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-m-theme-violet-100-1-firefox-linux.png
deleted file mode 100644
index 7128e69fb4..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-m-theme-violet-100-1-firefox-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-m-theme-violet-100-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-m-theme-violet-100-1-webkit-linux.png
deleted file mode 100644
index c1aad2afa6..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-110-size-m-theme-violet-100-1-webkit-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-50-size-l-theme-violet-100-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-50-size-l-theme-violet-100-1-chromium-linux.png
deleted file mode 100644
index 1e768d4555..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-50-size-l-theme-violet-100-1-chromium-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-50-size-l-theme-violet-100-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-50-size-l-theme-violet-100-1-firefox-linux.png
deleted file mode 100644
index d0e7dabf3e..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-50-size-l-theme-violet-100-1-firefox-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-50-size-l-theme-violet-100-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-50-size-l-theme-violet-100-1-webkit-linux.png
deleted file mode 100644
index 55f93d01f1..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-50-size-l-theme-violet-100-1-webkit-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-default-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-default-1-chromium-linux.png
new file mode 100644
index 0000000000..ca609f995a
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-default-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-default-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-default-1-firefox-linux.png
new file mode 100644
index 0000000000..64ef47b804
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-default-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-default-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-default-1-webkit-linux.png
new file mode 100644
index 0000000000..ebcbe03473
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-default-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-invert-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-invert-1-chromium-linux.png
new file mode 100644
index 0000000000..ca609f995a
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-invert-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-invert-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-invert-1-firefox-linux.png
new file mode 100644
index 0000000000..64ef47b804
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-invert-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-invert-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-invert-1-webkit-linux.png
new file mode 100644
index 0000000000..ebcbe03473
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-invert-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-violet-100-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-violet-100-1-chromium-linux.png
new file mode 100644
index 0000000000..27f6ab000e
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-violet-100-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-violet-100-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-violet-100-1-firefox-linux.png
new file mode 100644
index 0000000000..94f6b28a13
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-violet-100-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-violet-100-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-violet-100-1-webkit-linux.png
new file mode 100644
index 0000000000..4470c67794
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-value-customization-with-value-99-size-m-theme-violet-100-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-0-size-s-theme-invert-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-0-size-s-theme-invert-1-chromium-linux.png
deleted file mode 100644
index 097bfaf4b9..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-0-size-s-theme-invert-1-chromium-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-0-size-s-theme-invert-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-0-size-s-theme-invert-1-firefox-linux.png
deleted file mode 100644
index 8ea3e78857..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-0-size-s-theme-invert-1-firefox-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-0-size-s-theme-invert-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-0-size-s-theme-invert-1-webkit-linux.png
deleted file mode 100644
index 642108d820..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-0-size-s-theme-invert-1-webkit-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-default-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-default-1-chromium-linux.png
new file mode 100644
index 0000000000..c954bc7c98
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-default-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-default-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-default-1-firefox-linux.png
new file mode 100644
index 0000000000..86a31c2c66
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-default-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-default-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-default-1-webkit-linux.png
new file mode 100644
index 0000000000..c7040bf035
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-default-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-invert-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-invert-1-chromium-linux.png
new file mode 100644
index 0000000000..50c56cdc6c
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-invert-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-invert-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-invert-1-firefox-linux.png
new file mode 100644
index 0000000000..61d19cd4ff
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-invert-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-invert-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-invert-1-webkit-linux.png
new file mode 100644
index 0000000000..81e5ca6515
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-invert-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-violet-100-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-violet-100-1-chromium-linux.png
new file mode 100644
index 0000000000..af49781b0e
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-violet-100-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-violet-100-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-violet-100-1-firefox-linux.png
new file mode 100644
index 0000000000..71fe6ccc98
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-violet-100-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-violet-100-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-violet-100-1-webkit-linux.png
new file mode 100644
index 0000000000..3544cd7f97
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-1-size-s-theme-violet-100-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-default-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-default-1-chromium-linux.png
new file mode 100644
index 0000000000..1ec9effc01
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-default-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-default-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-default-1-firefox-linux.png
new file mode 100644
index 0000000000..ec502bbbfd
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-default-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-default-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-default-1-webkit-linux.png
new file mode 100644
index 0000000000..6e0edeb6b9
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-default-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-invert-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-invert-1-chromium-linux.png
new file mode 100644
index 0000000000..9ce9f4eb60
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-invert-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-invert-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-invert-1-firefox-linux.png
new file mode 100644
index 0000000000..50e7ff00b4
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-invert-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-invert-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-invert-1-webkit-linux.png
new file mode 100644
index 0000000000..00f811295d
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-invert-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-violet-100-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-violet-100-1-chromium-linux.png
new file mode 100644
index 0000000000..f4f13c8b3c
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-violet-100-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-violet-100-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-violet-100-1-firefox-linux.png
new file mode 100644
index 0000000000..2964c105c0
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-violet-100-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-violet-100-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-violet-100-1-webkit-linux.png
new file mode 100644
index 0000000000..4c5af88909
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-l-theme-violet-100-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-m-theme-dark-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-m-theme-dark-1-chromium-linux.png
deleted file mode 100644
index d89553a50a..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-m-theme-dark-1-chromium-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-m-theme-dark-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-m-theme-dark-1-firefox-linux.png
deleted file mode 100644
index f5e472b7b0..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-m-theme-dark-1-firefox-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-m-theme-dark-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-m-theme-dark-1-webkit-linux.png
deleted file mode 100644
index b33b6d2c89..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-110-size-m-theme-dark-1-webkit-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-50-size-l-theme-violet-100-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-50-size-l-theme-violet-100-1-chromium-linux.png
deleted file mode 100644
index 4628d4a09c..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-50-size-l-theme-violet-100-1-chromium-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-50-size-l-theme-violet-100-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-50-size-l-theme-violet-100-1-firefox-linux.png
deleted file mode 100644
index 668a005040..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-50-size-l-theme-violet-100-1-firefox-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-50-size-l-theme-violet-100-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-50-size-l-theme-violet-100-1-webkit-linux.png
deleted file mode 100644
index 952e8590f8..0000000000
Binary files a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-50-size-l-theme-violet-100-1-webkit-linux.png and /dev/null differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-default-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-default-1-chromium-linux.png
new file mode 100644
index 0000000000..354b99734e
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-default-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-default-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-default-1-firefox-linux.png
new file mode 100644
index 0000000000..1cfd7afa6d
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-default-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-default-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-default-1-webkit-linux.png
new file mode 100644
index 0000000000..9c07f32888
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-default-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-invert-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-invert-1-chromium-linux.png
new file mode 100644
index 0000000000..44caa4ca00
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-invert-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-invert-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-invert-1-firefox-linux.png
new file mode 100644
index 0000000000..89ed3a864b
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-invert-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-invert-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-invert-1-webkit-linux.png
new file mode 100644
index 0000000000..c2e6e1c3bb
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-invert-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-violet-100-1-chromium-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-violet-100-1-chromium-linux.png
new file mode 100644
index 0000000000..ad94cb60a7
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-violet-100-1-chromium-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-violet-100-1-firefox-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-violet-100-1-firefox-linux.png
new file mode 100644
index 0000000000..9f56a9ed52
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-violet-100-1-firefox-linux.png differ
diff --git a/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-violet-100-1-webkit-linux.png b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-violet-100-1-webkit-linux.png
new file mode 100644
index 0000000000..20eaa1214b
Binary files /dev/null and b/semcore/progress-bar/__tests__/progress-bar.browser-test.tsx-snapshots/-visual-Verify-progress-bar-with-background-customization-with-value-99-size-m-theme-violet-100-1-webkit-linux.png differ
diff --git a/semcore/progress-bar/src/ProgressBar.tsx b/semcore/progress-bar/src/ProgressBar.tsx
index ac90642e33..3fde52975c 100644
--- a/semcore/progress-bar/src/ProgressBar.tsx
+++ b/semcore/progress-bar/src/ProgressBar.tsx
@@ -10,7 +10,7 @@ import style from './style/progress-bar.shadow.css';
 function isCustomTheme(theme?: string) {
   if (!theme) return false;
 
-  return !['dark', 'invert'].includes(theme);
+  return !['default', 'invert'].includes(theme);
 }
 
 class ProgressBarRoot extends Component<
@@ -27,7 +27,7 @@ class ProgressBarRoot extends Component<
   static defaultProps = () => ({
     duration: 1000,
     size: 'm',
-    theme: 'invert',
+    theme: 'default',
     children: <ProgressBar.Value />,
   } as const);
 
@@ -50,7 +50,7 @@ class ProgressBarRoot extends Component<
       <SProgressBar
         render={Box}
         use:theme={useTheme}
-        use:animation={!value}
+        use:animation={value === undefined}
         use:duration={`${duration}ms`}
         colorBg={resolveColor(theme)}
         role='progressbar'
diff --git a/semcore/progress-bar/src/ProgressBar.type.ts b/semcore/progress-bar/src/ProgressBar.type.ts
index 1218cb371f..b47db11568 100644
--- a/semcore/progress-bar/src/ProgressBar.type.ts
+++ b/semcore/progress-bar/src/ProgressBar.type.ts
@@ -5,9 +5,9 @@ declare namespace NSProgressBar {
   type Props = NSBox.Props & {
     /**
      * Progress bar theme
-     * @default invert
+     * @default default
      */
-    theme?: 'dark' | 'invert' | string;
+    theme?: 'default' | 'invert' | string;
     /**
      * Progress bar size
      * @default m
@@ -23,7 +23,7 @@ declare namespace NSProgressBar {
   type DefaultProps = {
     duration: 1000;
     size: 'm';
-    theme: 'invert';
+    theme: 'default';
     children: React.ReactNode;
   };
 
diff --git a/semcore/progress-bar/src/style/progress-bar.shadow.css b/semcore/progress-bar/src/style/progress-bar.shadow.css
index ec68f7e777..8013c0aebf 100644
--- a/semcore/progress-bar/src/style/progress-bar.shadow.css
+++ b/semcore/progress-bar/src/style/progress-bar.shadow.css
@@ -2,11 +2,6 @@ SProgressBar {
   position: relative;
   width: 100%;
   overflow: hidden;
-  background-color: var(--intergalactic-progress-bar-bg, oklch(0.157 0.029 176 / 0.11));
-}
-
-SProgressBar[theme='dark'] {
-  background-color: var(--intergalactic-progress-bar-bg-invert, oklch(0.987 0.023 140 / 0.212));
 }
 
 SValue {
@@ -14,8 +9,6 @@ SValue {
   top: 0;
   left: 0;
   background-color: var(--intergalactic-progress-bar-value-bg, oklch(1 0 0));
-  background-image: var(--intergalactic-progress-bar-value-gradient,
-  linear-gradient(-45deg, oklch(from oklch(0.22 0.01 140) l c h / 0.78) 25%, oklch(0.22 0.01 140) 0%, oklch(0.22 0.01 140) 50%, oklch(from oklch(0.22 0.01 140) l c h / 0.78) 0%, oklch(from oklch(0.22 0.01 140) l c h / 0.78) 75%, oklch(0.22 0.01 140) 0%));
   overflow: hidden;
 
   animation-name: loading;
@@ -54,12 +47,6 @@ SValue[size='l'] {
   background-size: 16px 16px;
 }
 
-
-
-SProgressBar[theme='invert'] {
-  background-color: var(--intergalactic-progress-bar-bg, oklch(0.157 0.029 176 / 0.11));
-}
-
 @keyframes loading {
   from {
     background-position: 0 0;
@@ -71,7 +58,6 @@ SProgressBar[theme='invert'] {
 }
 
 SProgressBar[animation] {
-  background-color: var(--intergalactic-progress-bar-value-bg, oklch(1 0 0));
   background-image: var(--intergalactic-progress-bar-pattern-gradient,
   linear-gradient(-45deg, oklch(0 0 0 / 0.1) 25%, oklch(0.157 0.029 176 / 0.11) 0%, oklch(0.157 0.029 176 / 0.11) 50%, oklch(0 0 0 / 0.1) 0%, oklch(0 0 0 / 0.1) 75%, oklch(0.157 0.029 176 / 0.11) 0%));
   animation-name: loading;
@@ -80,6 +66,24 @@ SProgressBar[animation] {
   animation-duration: var(--duration);
 }
 
+SProgressBar[theme='default'] {
+  background-color: var(--intergalactic-progress-bar-bg, oklch(0.157 0.029 176 / 0.11));
+
+  SValue {
+    background-image: var(--intergalactic-progress-bar-value-gradient,
+    linear-gradient(-45deg, oklch(from oklch(0.22 0.01 140) l c h / 0.78) 25%, oklch(0.22 0.01 140) 0%, oklch(0.22 0.01 140) 50%, oklch(from oklch(0.22 0.01 140) l c h / 0.78) 0%, oklch(from oklch(0.22 0.01 140) l c h / 0.78) 75%, oklch(0.22 0.01 140) 0%));
+  }
+}
+
+SProgressBar[theme='invert'] {
+  background-color: var(--intergalactic-progress-bar-bg-invert, oklch(0.987 0.023 140 / 0.212));
+
+  SValue {
+    background-image: var(--intergalactic-progress-bar-value-gradient-invert,
+    linear-gradient(-45deg, oklch(from oklch(0.74 0.17 303) l c h / 0.78) 25%, oklch(0.74 0.17 303) 0%, oklch(0.74 0.17 303) 50%, oklch(from oklch(0.74 0.17 303) l c h / 0.78) 0%, oklch(from oklch(0.74 0.17 303) l c h / 0.78) 75%, oklch(0.74 0.17 303) 0%));
+  }
+}
+
 SProgressBar[theme='custom'] {
   background-color: var(--colorBg);
   background-image: var(--colorBg);
@@ -94,4 +98,4 @@ SProgressBar[theme='custom'] {
   SProgressBar[animation] {
     animation-name: none;
   }
-}
\ No newline at end of file
+}
diff --git a/stories/components/progress-bar/advanced/examples/all_themes.tsx b/stories/components/progress-bar/advanced/examples/all_themes.tsx
index 5a51566c4c..618860d844 100644
--- a/stories/components/progress-bar/advanced/examples/all_themes.tsx
+++ b/stories/components/progress-bar/advanced/examples/all_themes.tsx
@@ -26,23 +26,23 @@ export default function AllThemes() {
         <Flex gap={6} flexWrap alignItems='flex-start' direction='column'>
           <Box w={240}>
             <ProgressBar
-              theme='dark'
+              theme='invert'
               value={0}
-              aria-label='Progress 0%, dark theme on dark background'
+              aria-label='Progress 0%, invert theme on dark background'
             />
           </Box>
           <Box w={240}>
             <ProgressBar
-              theme='dark'
+              theme='invert'
               value={40}
-              aria-label='Progress 40%, dark theme on dark background'
+              aria-label='Progress 40%, invert theme on dark background'
             />
           </Box>
           <Box w={240}>
             <ProgressBar
-              theme='dark'
+              theme='invert'
               value={100}
-              aria-label='Progress 100%, dark theme on dark background'
+              aria-label='Progress 100%, invert theme on dark background'
             />
           </Box>
         </Flex>
diff --git a/stories/components/progress-bar/docs/examples/customizing_the_bar.tsx b/stories/components/progress-bar/docs/examples/customizing_the_bar.tsx
index f5e59a822d..073d6d92b2 100644
--- a/stories/components/progress-bar/docs/examples/customizing_the_bar.tsx
+++ b/stories/components/progress-bar/docs/examples/customizing_the_bar.tsx
@@ -14,7 +14,7 @@ const Demo = (props: ProgressBarExampleProps) => {
 export const defaultProps: ProgressBarExampleProps = {
   size: 'm',
   value: 60,
-  theme: 'progress-bar-bg',
+  theme: 'default',
   duration: undefined,
 };
 
diff --git a/stories/components/progress-bar/docs/progress-bar.stories.tsx b/stories/components/progress-bar/docs/progress-bar.stories.tsx
index 5d864aa998..860d04eb2f 100644
--- a/stories/components/progress-bar/docs/progress-bar.stories.tsx
+++ b/stories/components/progress-bar/docs/progress-bar.stories.tsx
@@ -25,7 +25,7 @@ export const CustomizingTheBar: StoryObj<typeof CustomizingTheBarProps> = {
     },
     theme: {
       control: { type: 'select' },
-      options: ['invert', 'dark', 'violet-100'],
+      options: ['default', 'invert', 'violet-100'],
     },
     value: {
       control: { type: 'number' },
diff --git a/stories/components/progress-bar/tests/examples/customizing_the_bar_with_background.tsx b/stories/components/progress-bar/tests/examples/customizing_the_bar_with_background.tsx
index 6c00af1d1d..b8481a5329 100644
--- a/stories/components/progress-bar/tests/examples/customizing_the_bar_with_background.tsx
+++ b/stories/components/progress-bar/tests/examples/customizing_the_bar_with_background.tsx
@@ -1,23 +1,92 @@
-import { Box } from '@semcore/ui/base-components';
+import { Box, Flex } from '@semcore/ui/base-components';
 import ProgressBar from '@semcore/ui/progress-bar';
 import type { NSProgressBar } from '@semcore/ui/progress-bar';
+import { Text } from '@semcore/ui/typography';
 import React from 'react';
 
 type ProgressBarExampleProps = NSProgressBar.Props;
+
+const BACKGROUNDS = [
+  { bg: 'bg-primary-neutral', textColor: 'text-primary', label: 'Light background' },
+  { bg: 'bg-primary-invert', textColor: 'text-primary-invert', label: 'Dark background' },
+] as const;
+
 const Demo = (props: ProgressBarExampleProps) => {
+  const { theme, size, value, duration } = props;
+
   return (
-    <Box bg='bg-primary-invert' h={50}>
-      <ProgressBar tabIndex={0} value={props.value} size={props.size} theme={props.theme} aria-label='Custom theme example' duration={props.duration}>
-      </ProgressBar>
-    </Box>
+    <Flex direction='column' gap={6} w='100%'>
+      {BACKGROUNDS.map((background) => (
+        <Box key={background.bg} bg={background.bg} p={5}>
+          <Flex direction='column' gap={4} w='100%'>
+            <Text size={200} color={background.textColor}>
+              {background.label} — theme={String(theme)}, size={String(size)}
+            </Text>
+
+            <Flex direction='column' gap={2} w='100%'>
+              <Text size={100} color={background.textColor}>
+                controlled value: {String(value)}
+              </Text>
+              <ProgressBar
+                tabIndex={0}
+                theme={theme}
+                size={size}
+                value={value}
+                duration={duration}
+                aria-label={`Progress ${value}% on ${background.label}`}
+              />
+            </Flex>
+
+            <Flex direction='column' gap={2} w='100%'>
+              <Text size={100} color={background.textColor}>
+                value=0
+              </Text>
+              <ProgressBar
+                theme={theme}
+                size={size}
+                value={0}
+                duration={duration}
+                aria-label={`Progress 0% on ${background.label}`}
+              />
+            </Flex>
+
+            <Flex direction='column' gap={2} w='100%'>
+              <Text size={100} color={background.textColor}>
+                value=100
+              </Text>
+              <ProgressBar
+                theme={theme}
+                size={size}
+                value={100}
+                duration={duration}
+                aria-label={`Progress 100% on ${background.label}`}
+              />
+            </Flex>
+
+            <Flex direction='column' gap={2} w='100%'>
+              <Text size={100} color={background.textColor}>
+                no value prop
+              </Text>
+              {/* `value` is intentionally not passed: the animated pattern renders only when value === undefined */}
+              <ProgressBar
+                theme={theme}
+                size={size}
+                duration={duration}
+                aria-label={`Indeterminate progress on ${background.label}`}
+              />
+            </Flex>
+          </Flex>
+        </Box>
+      ))}
+    </Flex>
   );
 };
 
 export const defaultProps: ProgressBarExampleProps = {
+  theme: 'default',
   size: 'm',
-  value: 80,
-  theme: undefined,
-  duration: undefined,
+  value: 60,
+  duration: 1000,
 };
 
 Demo.defaultProps = defaultProps;
diff --git a/stories/components/progress-bar/tests/examples/customizing_the_value.tsx b/stories/components/progress-bar/tests/examples/customizing_the_value.tsx
index c2d85ab3b3..bee2ccdfa6 100644
--- a/stories/components/progress-bar/tests/examples/customizing_the_value.tsx
+++ b/stories/components/progress-bar/tests/examples/customizing_the_value.tsx
@@ -8,7 +8,7 @@ const Demo = (props: ProgressBarExampleProps) => {
   return (
     <Box>
 
-      <ProgressBar tabIndex={0} aria-label='Custom theme example'>
+      <ProgressBar tabIndex={0} aria-label='Custom theme example' size={props.size}>
         <ProgressBar.Value value={props.value} size={props.size} theme={props.theme} duration={props.duration} />
       </ProgressBar>
 
diff --git a/stories/components/progress-bar/tests/progress-bar.stories.tsx b/stories/components/progress-bar/tests/progress-bar.stories.tsx
index 400e74dd41..a9b656c2aa 100644
--- a/stories/components/progress-bar/tests/progress-bar.stories.tsx
+++ b/stories/components/progress-bar/tests/progress-bar.stories.tsx
@@ -15,16 +15,21 @@ const commonArgTypes = {
   size: {
     control: { type: 'select' },
     options: ['s', 'm', 'l'],
+    description: 'Height and border-radius of the bar',
   },
   value: {
     control: { type: 'number' },
+    description: 'Progress as a percentage. Omit it to get the indeterminate animated bar',
   },
   duration: {
     control: { type: 'number' },
+    description: 'Animation/transition duration in ms',
   },
   theme: {
     control: { type: 'select' },
-    options: ['invert', 'dark', 'violet-100'],
+    options: ['default', 'invert', 'violet-100', 'brand-secondary'],
+    description:
+      'Built-in themes are `default` (light backgrounds) and `invert` (dark backgrounds). Any other value falls through to the custom-theme path and is resolved as a color token.',
   },
 } as const;
 
diff --git a/tools/theme/src/theme.ts b/tools/theme/src/theme.ts
index fa7bfbc65c..a3dc4d767d 100644
--- a/tools/theme/src/theme.ts
+++ b/tools/theme/src/theme.ts
@@ -1440,10 +1440,14 @@ export const theme: Theme = {
         value: 'oklch(1 0 0)',
         description: 'Base value background for the ProgressBar. It is used to create gradients for the values.',
       },
-      progress_bar_value_gradient: {
+      progress_bar_value_gradient_DEFAULT: {
         value: 'linear-gradient(-45deg, oklch(from {semanticTokens.colors.brand.secondary} l c h / 0.78) 25%, {semanticTokens.colors.brand.secondary} 0%, {semanticTokens.colors.brand.secondary} 50%, oklch(from {semanticTokens.colors.brand.secondary} l c h / 0.78) 0%, oklch(from {semanticTokens.colors.brand.secondary} l c h / 0.78) 75%, {semanticTokens.colors.brand.secondary} 0%)',
         description: 'Value with gradient for the ProgressBar.',
       },
+      progress_bar_value_gradient_invert: {
+        value: 'linear-gradient(-45deg, oklch(from {semanticTokens.colors.brand.primary} l c h / 0.78) 25%, {semanticTokens.colors.brand.primary} 0%, {semanticTokens.colors.brand.primary} 50%, oklch(from {semanticTokens.colors.brand.primary} l c h / 0.78) 0%, oklch(from {semanticTokens.colors.brand.primary} l c h / 0.78) 75%, {semanticTokens.colors.brand.primary} 0%)',
+        description: 'Value with gradient for the ProgressBar.',
+      },
       scroll_area_dropdown_menu_bottom: {
         value: 'linear-gradient(to top, {baseTokens.colors.white} 34.38%, transparent 100%)',
         description: 'Bottom-to-top fade shadow for the ScrollArea inside the DropdownMenu.',
@@ -3002,7 +3006,10 @@ type SemanticColors = {
         };
       };
       value: {
-        gradient: Value;
+        gradient: {
+          DEFAULT: Value;
+          invert: Value;
+        };
         bg: Value;
       };
       pattern: {
diff --git a/website/docs/components/progress-bar/progress-bar.md b/website/docs/components/progress-bar/progress-bar.md
index 079e2ac4cf..410df1d768 100644
--- a/website/docs/components/progress-bar/progress-bar.md
+++ b/website/docs/components/progress-bar/progress-bar.md
@@ -38,14 +38,16 @@ Table: ProgressBar sizes and styles
 
 ### Themes
 
-ProgressBar offers two themes: `dark` and `invert`, which are suitable for light and dark/colored backgrounds respectively. Both themes use the `--progress-bar-value` token for color with a gradient pattern to indicate progress.
+ProgressBar offers two themes: `default` and `invert`, which are suitable for light and dark/colored backgrounds respectively. Each theme colors the value with its own gradient token to indicate progress.
 
 Table: ProgressBar themes
 
-| Theme  | Appearance example       | Background token            |
-| ------ | ------------------------ | --------------------------- |
-| Invert | ![](static/size-l.png)   | `--progress-bar-bg`         |
-| Dark   | ![](static/dark-theme.png) | `--progress-bar-bg-invert`|
+| Theme   | Appearance example         | Background token           | Value gradient token                    |
+| ------- | -------------------------- | -------------------------- | --------------------------------------- |
+| Default | ![](static/size-l.png)     | `--progress-bar-bg`        | `--progress-bar-value-gradient`         |
+| Invert  | ![](static/dark-theme.png) | `--progress-bar-bg-invert` | `--progress-bar-value-gradient-invert`  |
+
+Passing any other value to `theme` is treated as a custom color token and is resolved as the bar's color.
 
 ## Interaction
 
diff --git a/website/docs/style/design-tokens/design-tokens.json b/website/docs/style/design-tokens/design-tokens.json
index 466b219300..8dc8c0f4ac 100644
--- a/website/docs/style/design-tokens/design-tokens.json
+++ b/website/docs/style/design-tokens/design-tokens.json
@@ -2128,6 +2128,14 @@
       "progress-bar"
     ]
   },
+  {
+    "name": "--intergalactic-progress-bar-value-gradient-invert",
+    "value": "linear-gradient(-45deg, oklch(from oklch(0.74 0.17 303) l c h / 0.78) 25%, oklch(0.74 0.17 303) 0%, oklch(0.74 0.17 303) 50%, oklch(from oklch(0.74 0.17 303) l c h / 0.78) 0%, oklch(from oklch(0.74 0.17 303) l c h / 0.78) 75%, oklch(0.74 0.17 303) 0%)",
+    "description": "Value with gradient for the ProgressBar.",
+    "components": [
+      "progress-bar"
+    ]
+  },
   {
     "name": "--intergalactic-scroll-area-dropdown-menu-bottom",
     "value": "linear-gradient(to top, #fff 34.38%, transparent 100%)",