diff --git a/changelogs/upcoming/7538.md b/changelogs/upcoming/7538.md
new file mode 100644
index 00000000000..fb97e0dabe8
--- /dev/null
+++ b/changelogs/upcoming/7538.md
@@ -0,0 +1,3 @@
+**Bug fixes**
+
+- Fixed missing animation on native `EuiProgress` bar update
diff --git a/src/components/progress/progress.styles.ts b/src/components/progress/progress.styles.ts
index 1e2b4f624bb..8e073ffca89 100644
--- a/src/components/progress/progress.styles.ts
+++ b/src/components/progress/progress.styles.ts
@@ -10,6 +10,7 @@ import { css, keyframes } from '@emotion/react';
 import {
   logicalCSS,
   logicalTextAlignCSS,
+  euiCanAnimate,
   euiCantAnimate,
   euiFontSize,
   euiTextTruncate,
@@ -105,9 +106,13 @@ export const euiProgressStyles = (
       background-color: ${euiTheme.colors.lightShade};
     }
 
-    ${crossBrowserProgressValue(
-      'transition: width ${euiTheme.animation.normal} linear;'
-    )}
+    ${euiCanAnimate} {
+      /* Note: FF/Mozilla doesn't actually support animating the native progress bar
+        @see https://bugzilla.mozilla.org/show_bug.cgi?id=662351 */
+      ${crossBrowserProgressValue(
+        `transition: width ${euiTheme.animation.normal} linear`
+      )}
+    }
   `,
   // An indeterminate bar has an unreliable end time. Because of a Firefox animation issue,
   // we apply this style to a <div> instead of a <progress> element.