diff --git a/components/SideNavbar/SideNavbarBody.tsx b/components/SideNavbar/SideNavbarBody.tsx
index 2dfc37854..7a2360035 100644
--- a/components/SideNavbar/SideNavbarBody.tsx
+++ b/components/SideNavbar/SideNavbarBody.tsx
@@ -10,8 +10,13 @@ export const SideNavbarBody: FC = () => {
   const { setSearch, searchResults, debouncedSearch } = useSidebarSearch()
 
   return (
-    <div className="bg-[rgba(255,255,255,0.3)] w-full overflow-x-hidden whitespace-nowrap transition-all ease-in dark:bg-dark dark:text-text-primary">
-      <div className="bg-light-primary p-4 pt-0 transition-all ease-in dark:bg-dark">
+    <div
+      className={classNames(
+        `bg-[rgba(243,244,246,1)] h-full w-full overflow-x-hidden whitespace-nowrap transition-all ease-in dark:bg-dark dark:text-text-primary`,
+        theme === 'light' ? 'scrollColorLight' : 'scrollColorDark'
+      )}
+    >
+      <div className="bg-primary-light transiton-all w-full p-4 transition-none ease-in dark:bg-dark">
         <Searchbar setSearch={setSearch} />
       </div>