diff --git a/src/components/v5/frame/PageLayout/PageLayout.tsx b/src/components/v5/frame/PageLayout/PageLayout.tsx
index 6487c9f23d..46e3a2b159 100644
--- a/src/components/v5/frame/PageLayout/PageLayout.tsx
+++ b/src/components/v5/frame/PageLayout/PageLayout.tsx
@@ -66,7 +66,7 @@ const PageLayout: FC<PropsWithChildren<PageLayoutProps>> = ({
             </section>
             <section
               className={clsx(
-                'modal-blur h-full w-full overflow-auto px-6 md:p-8 md:pb-0 md:pt-2',
+                'modal-blur h-full w-full overflow-auto px-6 scrollbar-gutter-stable md:p-8 md:pb-0 md:pt-2',
                 {
                   'md:!pt-[1.125rem]': !pageTitle,
                 },
diff --git a/tailwind.config.js b/tailwind.config.js
index 8750698105..c95098db47 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -270,10 +270,13 @@ module.exports = {
         '.no-scrollbar::-webkit-scrollbar': {
           display: 'none',
         },
+        '.scrollbar-gutter-stable': {
+          'scrollbar-gutter': 'stable',
+        },
         '.bold-on-hover': {
           '@apply relative after:w-full after:h-4.5 after:z-base after:block after:absolute after:top-1/2 after:left-1/2 after:-translate-x-1/2 after:-translate-y-1/2 after:overflow-hidden after:text-gray-700 hover:after:text-gray-900 after:font-medium hover:after:font-semibold after:content-[attr(aria-label)]':
             {},
-        }
+        },
       });
       addComponents({
         '.inner': {