diff --git a/src/renderer/features/sidebar/components/sidebar.module.css b/src/renderer/features/sidebar/components/sidebar.module.css
index 81309fec..9805cfa1 100644
--- a/src/renderer/features/sidebar/components/sidebar.module.css
+++ b/src/renderer/features/sidebar/components/sidebar.module.css
@@ -8,6 +8,10 @@
     background: var(--theme-colors-background-alternate);
 }
 
+.container.custom-bar {
+    max-height: calc(100vh - 120px);
+}
+
 .scroll-area {
     padding: 0 var(--theme-spacing-md) var(--theme-spacing-md) var(--theme-spacing-md);
 }
diff --git a/src/renderer/features/sidebar/components/sidebar.tsx b/src/renderer/features/sidebar/components/sidebar.tsx
index cef2c870..8bc361f1 100644
--- a/src/renderer/features/sidebar/components/sidebar.tsx
+++ b/src/renderer/features/sidebar/components/sidebar.tsx
@@ -1,3 +1,4 @@
+import clsx from 'clsx';
 import { AnimatePresence, motion } from 'motion/react';
 import { CSSProperties, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -98,9 +99,14 @@ export const Sidebar = () => {
         return '100%';
     }, [showImage, sidebar.leftWidth, windowBarStyle]);
 
+    const isCustomWindowBar =
+        windowBarStyle === Platform.WINDOWS || windowBarStyle === Platform.MACOS;
+
     return (
         <div
-            className={styles.container}
+            className={clsx(styles.container, {
+                [styles.customBar]: isCustomWindowBar,
+            })}
             id="left-sidebar"
         >
             <Group