diff --git a/.changeset/full-boats-shop.md b/.changeset/full-boats-shop.md
new file mode 100644
index 0000000000..0b85c471f4
--- /dev/null
+++ b/.changeset/full-boats-shop.md
@@ -0,0 +1,5 @@
+---
+'@solid-design-system/components': patch
+---
+
+Moved autoplay button in `sd-carousel` before navigation in DOM order for correct screen reader focus sequence
diff --git a/packages/components/src/components/carousel/carousel.ts b/packages/components/src/components/carousel/carousel.ts
index a4c438f3eb..30ba449337 100644
--- a/packages/components/src/components/carousel/carousel.ts
+++ b/packages/components/src/components/carousel/carousel.ts
@@ -641,7 +641,33 @@ export default class SdCarousel extends SolidElement {
     const isLtr = this.localize.dir() === 'ltr';
 
     return html`
-      <div part="base" class=${cx(`carousel h-full w-full`)}>
+      <div part="base" class=${cx(`carousel h-full w-full relative`)}>
+        <button
+          class=${cx(
+            'ml-6 !rounded-sm',
+            '!absolute !bottom-0 !right-0 sd-interactive',
+            this.inverted ? 'sd-interactive--inverted' : 'sd-interactive--reset',
+            !this.autoplay && '!hidden'
+          )}
+          part="autoplay-controls"
+          aria-label="${this.pausedAutoplay ? this.localize.term('startAutoplay') : this.localize.term('stopAutoplay')}"
+          aria-pressed="true"
+          @click=${(e: MouseEvent) => {
+            this.pausedAutoplay = !this.pausedAutoplay;
+            if (e.detail) {
+              this.autoplayControls.blur();
+            }
+          }}
+        >
+          <slot name="autoplay-start" class=${cx(!this.pausedAutoplay ? 'hidden' : '')}>
+            <sd-icon class="h-6 w-6 grid place-items-center" library="_internal" name="start"></sd-icon>
+          </slot>
+
+          <slot name="autoplay-pause" class=${cx(this.pausedAutoplay ? 'hidden' : '')}>
+            <sd-icon class="h-6 w-6 grid place-items-center" library="_internal" name="pause"></sd-icon>
+          </slot>
+        </button>
+
         <div
           class="carousel__announcement sr-only"
           aria-live=${!this.autoplay || this.pausedAutoplay || this.isFocused ? 'polite' : 'off'}
@@ -801,33 +827,6 @@ export default class SdCarousel extends SolidElement {
               </slot>
             </button>
           </div>
-          <button
-            class=${cx(
-              'ml-6 !rounded-sm',
-              '!absolute !right-0 sd-interactive',
-              this.inverted ? 'sd-interactive--inverted' : 'sd-interactive--reset',
-              !this.autoplay && '!hidden'
-            )}
-            part="autoplay-controls"
-            aria-label="${this.pausedAutoplay
-              ? this.localize.term('startAutoplay')
-              : this.localize.term('stopAutoplay')}"
-            aria-pressed="true"
-            @click=${(e: MouseEvent) => {
-              this.pausedAutoplay = !this.pausedAutoplay;
-              if (e.detail) {
-                this.autoplayControls.blur();
-              }
-            }}
-          >
-            <slot name="autoplay-start" class=${cx(!this.pausedAutoplay ? 'hidden' : '')}>
-              <sd-icon class="h-6 w-6 grid place-items-center" library="_internal" name="start"></sd-icon>
-            </slot>
-
-            <slot name="autoplay-pause" class=${cx(this.pausedAutoplay ? 'hidden' : '')}>
-              <sd-icon class="h-6 w-6 grid place-items-center" library="_internal" name="pause"></sd-icon>
-            </slot>
-          </button>
         </div>
       </div>
     `;