diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-colorblind-linux.png
index cc4d3da3848..6efca92fe5a 100644
Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-colorblind-linux.png and b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-dimmed-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-dimmed-linux.png
index cd4bb8ed290..4cf18cdcfb2 100644
Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-dimmed-linux.png and b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-high-contrast-linux.png
index 0c313f1b66b..8d112d8aa18 100644
Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-high-contrast-linux.png and b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-linux.png
index 6bf31872810..32ca24b8177 100644
Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-linux.png and b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-linux.png differ
diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-tritanopia-linux.png
index cc4d3da3848..6efca92fe5a 100644
Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-tritanopia-linux.png and b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-colorblind-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-colorblind-linux.png
index 9ac39b51608..f7df9bdde31 100644
Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-colorblind-linux.png and b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-high-contrast-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-high-contrast-linux.png
index 8c5819900bd..0d453a90b61 100644
Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-high-contrast-linux.png and b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-linux.png
index 190a7f35052..c5fd014483e 100644
Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-linux.png and b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-linux.png differ
diff --git a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-tritanopia-linux.png b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-tritanopia-linux.png
index 9ac39b51608..f7df9bdde31 100644
Binary files a/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-tritanopia-linux.png and b/.playwright/snapshots/components/drafts/Button2.test.ts-snapshots/Button-sx-prop-light-tritanopia-linux.png differ
diff --git a/src/Button/Button.dev.stories.tsx b/src/Button/Button.dev.stories.tsx
index 0a1c5db0d82..77d71808dcb 100644
--- a/src/Button/Button.dev.stories.tsx
+++ b/src/Button/Button.dev.stories.tsx
@@ -53,7 +53,7 @@ export const TestSxProp = () => {
             color: 'deepskyblue',
           },
           [`@media screen and (max-width: 768px)`]: {
-            color: 'salmon',
+            color: 'maroon',
           },
           '@media screen and (min-width: 768px)': {
             ':focus': {
diff --git a/src/PageHeader/PageHeader.examples.stories.tsx b/src/PageHeader/PageHeader.examples.stories.tsx
index 5377cd5897c..64f08be4c12 100644
--- a/src/PageHeader/PageHeader.examples.stories.tsx
+++ b/src/PageHeader/PageHeader.examples.stories.tsx
@@ -235,6 +235,7 @@ export const WithPageLayout = () => {
             p: 3,
             borderRadius: 2,
           }}
+          tabIndex={0}
         >
           This box has really long content. If it is too long, it will cause x overflow and should show a scrollbar.
           When this overflows, it should not break to overall page layout!
diff --git a/src/__tests__/deprecated/__snapshots__/ChoiceFieldset.test.tsx.snap b/src/__tests__/deprecated/__snapshots__/ChoiceFieldset.test.tsx.snap
index ba1610c7f2c..f66ea583f06 100644
--- a/src/__tests__/deprecated/__snapshots__/ChoiceFieldset.test.tsx.snap
+++ b/src/__tests__/deprecated/__snapshots__/ChoiceFieldset.test.tsx.snap
@@ -2102,6 +2102,13 @@ exports[`ChoiceFieldset renders with a success validation message 1`] = `
   margin-top: 8px;
 }
 
+@media (prefers-reduced-motion) {
+  .c11 {
+    -webkit-animation: none;
+    animation: none;
+  }
+}
+
 @media (forced-colors:active) {
   .c6 {
     background-color: canvastext;
@@ -2408,6 +2415,13 @@ exports[`ChoiceFieldset renders with an error validation message 1`] = `
   margin-top: 8px;
 }
 
+@media (prefers-reduced-motion) {
+  .c11 {
+    -webkit-animation: none;
+    animation: none;
+  }
+}
+
 @media (forced-colors:active) {
   .c6 {
     background-color: canvastext;
diff --git a/src/drafts/Button2/Button.dev.stories.tsx b/src/drafts/Button2/Button.dev.stories.tsx
index 94f06efa15c..6fc0a05c813 100644
--- a/src/drafts/Button2/Button.dev.stories.tsx
+++ b/src/drafts/Button2/Button.dev.stories.tsx
@@ -41,10 +41,10 @@ export const TestSxProp = () => {
       <Button
         size="medium"
         sx={{
-          color: 'deeppink',
+          color: 'firebrick',
         }}
       >
-        Medium Pink
+        Medium Red
       </Button>
       <Button
         size="small"
@@ -53,7 +53,7 @@ export const TestSxProp = () => {
             color: 'deepskyblue',
           },
           [`@media screen and (max-width: 768px)`]: {
-            color: 'salmon',
+            color: 'maroon',
           },
           '@media screen and (min-width: 768px)': {
             ':focus': {
@@ -61,14 +61,14 @@ export const TestSxProp = () => {
             },
           },
           '@media (min-width: 1440)': {
-            color: 'deeppink',
+            color: 'firebrick',
           },
         }}
       >
-        Pink
+        Red
       </Button>
-      <Button leadingIcon={SearchIcon} variant="invisible" sx={{color: 'deeppink'}}>
-        Pink
+      <Button leadingIcon={SearchIcon} variant="invisible" sx={{color: 'firebrick'}}>
+        Red
       </Button>
       <Button
         size="small"
diff --git a/src/drafts/MarkdownViewer/MarkdownViewer.stories.tsx b/src/drafts/MarkdownViewer/MarkdownViewer.stories.tsx
index 1d052f3d777..588c9a27ae8 100644
--- a/src/drafts/MarkdownViewer/MarkdownViewer.stories.tsx
+++ b/src/drafts/MarkdownViewer/MarkdownViewer.stories.tsx
@@ -75,9 +75,9 @@ const sampleHtml = `
 </ul>
 <h4>Tasks</h4>
 <ul class="contains-task-list">
-<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Task 1</li>
-<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Task 2</li>
-<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Task 3</li>
+<li class="task-list-item"><label><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Task 1</label></li>
+<li class="task-list-item"><label><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Task 2</label></li>
+<li class="task-list-item"><label><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Task 3</label></li>
 </ul>`
 
 const htmlObject = {__html: sampleHtml}
diff --git a/src/internal/components/ValidationAnimationContainer.tsx b/src/internal/components/ValidationAnimationContainer.tsx
index 3e4e3773869..e5756ec48e5 100644
--- a/src/internal/components/ValidationAnimationContainer.tsx
+++ b/src/internal/components/ValidationAnimationContainer.tsx
@@ -19,6 +19,9 @@ const fadeIn = keyframes`
 // using easeOutQuint easing fn https://easings.net/#easeOutQuint
 const AnimatedElement = styled.div<Props>`
   animation: ${props => props.show && css`170ms ${fadeIn} cubic-bezier(0.44, 0.74, 0.36, 1);`};
+  @media (prefers-reduced-motion) {
+    animation: none;
+  }
 `
 const ValidationAnimationContainer: React.FC<React.PropsWithChildren<Props>> = ({show, children}) => {
   const [shouldRender, setRender] = useState(show)
diff --git a/src/stories/useAnchoredPosition.stories.tsx b/src/stories/useAnchoredPosition.stories.tsx
index 3fbe81d41ff..7f3f4e34265 100644
--- a/src/stories/useAnchoredPosition.stories.tsx
+++ b/src/stories/useAnchoredPosition.stories.tsx
@@ -195,6 +195,7 @@ export const ComplexAncestry = () => {
           overflow: 'auto',
           position: 'relative',
         }}
+        tabIndex={0}
       >
         Clipping container - this element has <code>overflow</code> set to something other than <code>visible</code>
         <Box m={space} p={space} sx={{border: '1px solid #000', backgroundColor: 'blue.2', position: 'relative'}}>