diff --git a/docs/src/__examples__/HorizontalScroll/default.tsx b/docs/src/__examples__/HorizontalScroll/default.tsx
index bd13395d2b..8ed67e4a31 100644
--- a/docs/src/__examples__/HorizontalScroll/default.tsx
+++ b/docs/src/__examples__/HorizontalScroll/default.tsx
@@ -88,7 +88,20 @@ export default {
         {
           name: "spacing",
           type: "select",
-          options: ["none", "50", "100", "200", "300", "400", "600", "800", "1000"],
+          options: [
+            "none",
+            "50",
+            "100",
+            "150",
+            "200",
+            "300",
+            "400",
+            "600",
+            "800",
+            "1000",
+            "1200",
+            "1600",
+          ],
           defaultValue: "none",
         },
       ],
diff --git a/packages/orbit-components/src/HorizontalScroll/index.tsx b/packages/orbit-components/src/HorizontalScroll/index.tsx
index 9dabe92ea7..136afefef5 100644
--- a/packages/orbit-components/src/HorizontalScroll/index.tsx
+++ b/packages/orbit-components/src/HorizontalScroll/index.tsx
@@ -11,8 +11,6 @@ import ChevronBackward from "../icons/ChevronBackward";
 import ChevronForward from "../icons/ChevronForward";
 import type { Props, ScrollSnap } from "./types";
 
-const TRIGGER_OFFSET = 20;
-
 const getSnap = (scrollSnap: ScrollSnap) => {
   if (scrollSnap === "mandatory") return "x mandatory";
   if (scrollSnap === "proximity") return "x proximity";
@@ -106,13 +104,14 @@ const HorizontalScroll = React.forwardRef<HTMLDivElement, Props>(
       if (scrollEl) {
         const scrollWidth = scrollEl.scrollWidth - scrollEl.clientWidth;
         const { scrollLeft } = scrollEl;
-        if (scrollLeft - TRIGGER_OFFSET <= 0) {
+
+        if (scrollLeft === 0) {
           setReachedStart(true);
         } else {
           setReachedStart(false);
         }
 
-        if (scrollLeft + TRIGGER_OFFSET >= scrollWidth) {
+        if (scrollLeft >= scrollWidth) {
           setReachedEnd(true);
         } else {
           setReachedEnd(false);
@@ -132,7 +131,7 @@ const HorizontalScroll = React.forwardRef<HTMLDivElement, Props>(
       return () => {
         window.removeEventListener("resize", handleResize);
       };
-    }, [handleOverflow, handleResize]);
+    }, [handleOverflow, handleResize, scrollWrapperRef.current?.scrollWidth]);
 
     return (
       <div