diff --git a/components/navigation/FlyoutMenu.tsx b/components/navigation/FlyoutMenu.tsx
index fc5ab7d41a4e..b69cfc890dd7 100644
--- a/components/navigation/FlyoutMenu.tsx
+++ b/components/navigation/FlyoutMenu.tsx
@@ -19,7 +19,7 @@ export default function Flyout({ items = [] }: FlyoutProps) {
     >
       <div className='rounded-lg shadow-lg'>
         <div className='shadow-xs overflow-hidden rounded-lg'>
-          <div className='relative z-20 grid gap-6 bg-white px-5 py-6 sm:gap-8 sm:p-8 lg:grid-cols-2'>
+          <div className='scrollbar-thin scrollbar-thumb-gray-400 scrollbar-track-transparent relative z-20 grid max-h-[calc(100vh-20px)] gap-6 overflow-y-auto bg-white px-5 py-6 sm:gap-8 sm:p-8 lg:grid-cols-2'>
             <MenuBlocks items={items} />
           </div>
         </div>