diff --git a/components/mobile-nav.tsx b/components/mobile-nav.tsx
index 4756ddb..718a5ea 100644
--- a/components/mobile-nav.tsx
+++ b/components/mobile-nav.tsx
@@ -27,14 +27,14 @@ export const MobileNav = () => {
       />
 
       <Modal isOpen={isOpen} close={() => setIsOpen(false)}>
-        <div className="w-full h-[calc(100vh-144px)] mt-36 flex sm:hidden bg-white dark:bg-zinc-900 pointer-events-auto border-t border-t-zinc-100 dark:border-t-zinc-700 overflow-y-auto">
+        <div className="w-full h-[calc(100vh-144px)] mt-36 flex sm:hidden bg-white dark:bg-midnight-slate pointer-events-auto border-t border-t-zinc-100 dark:border-t-zinc-700 overflow-y-auto">
           <nav className="relative w-full">
             <ul className="w-full flex flex-col items-end justify-center gap-2 p-4 pb-24">
               {MOBILE_NAV_ITEMS.map((navItem, i) => (
                 <NavDropdown key={i} {...navItem} />
               ))}
             </ul>
-            <div className="fixed -bottom-2 left-0 w-full h-32 bg-gradient-to-b from-white/75 dark:from-zinc-900/75 to-white dark:to-zinc-900 pointer-events-none blur-[6px]" />
+            <div className="fixed -bottom-2 left-0 w-full h-32 bg-gradient-to-b from-white/75 dark:from-midnight-slate/75 to-white dark:to-midnight-slate pointer-events-none blur-[6px]" />
           </nav>
         </div>
       </Modal>