diff --git a/frontend/src/components/AsideMenuItem.tsx b/frontend/src/components/AsideMenuItem.tsx
index c5a8b8a..65664f9 100644
--- a/frontend/src/components/AsideMenuItem.tsx
+++ b/frontend/src/components/AsideMenuItem.tsx
@@ -74,11 +74,11 @@ const AsideMenuItem = ({ item, isDropdownList = false }: Props) => {
   );
 
   const componentClass = [
-    'flex cursor-pointer py-1.5 ',
+    'flex cursor-pointer py-1 ',
     isDropdownList ? 'px-6 text-sm' : '',
     item.color
       ? getButtonColor(item.color, false, true)
-      : `${asideMenuItemStyle}`,
+      : `${asideMenuItemStyle} text-white`,
     isLinkActive
       ? `text-black ${activeLinkColor} dark:text-white dark:bg-dark-800`
       : '',
diff --git a/frontend/src/components/AsideMenuLayer.tsx b/frontend/src/components/AsideMenuLayer.tsx
index 580877f..74cbab6 100644
--- a/frontend/src/components/AsideMenuLayer.tsx
+++ b/frontend/src/components/AsideMenuLayer.tsx
@@ -37,7 +37,7 @@ export default function AsideMenuLayer({
       className={`${className} zzz lg:py-2 lg:pl-2 w-60 fixed flex z-40 top-0 h-screen transition-position overflow-hidden`}
     >
       <div
-        className={`flex-1 flex flex-col overflow-hidden dark:bg-dark-900 ${asideStyle}`}
+        className={`flex-1 flex flex-col overflow-hidden bg-[#333] ${asideStyle}`}
       >
         <div
           className={`flex flex-row h-14 items-center justify-between ${asideBrandStyle}`}