diff --git a/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/body/PostedTime.tsx b/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/body/PostedTime.tsx
index aaf5afbe..adb1648d 100644
--- a/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/body/PostedTime.tsx
+++ b/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/body/PostedTime.tsx
@@ -28,7 +28,7 @@ export async function PostedTime({
             <div
               className={`flex flex-row items-center gap-4 p-2 ${
                 border
-                  ? `rounded-lg border border-neutral-200 bg-white dark:border-neutral-500
+                  ? `dark:border-neutral-650 rounded-lg border border-neutral-200 bg-white
                     dark:bg-neutral-500`
                   : ''
                 }`}
diff --git a/apps/web-arbitrum/app/components/theme-switch.tsx b/apps/web-arbitrum/app/components/theme-switch.tsx
index b76d46bc..fe8109b0 100644
--- a/apps/web-arbitrum/app/components/theme-switch.tsx
+++ b/apps/web-arbitrum/app/components/theme-switch.tsx
@@ -16,37 +16,46 @@ export function ModeToggle() {
     <DropdownMenu>
       <DropdownMenuTrigger asChild>
         <button
-          className='inline-flex items-center justify-center rounded-md border p-2'
+          className='border-neutral-350 inline-flex items-center justify-center rounded-md border
+            bg-white p-2 transition-colors hover:bg-neutral-100 focus:outline-none
+            dark:border-neutral-800 dark:bg-neutral-950 dark:hover:bg-neutral-800'
           aria-label='Toggle theme'
         >
           <Sun
-            className='h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90
-              dark:scale-0'
+            className='h-[1.2rem] w-[1.2rem] rotate-0 scale-100 text-neutral-600 transition-all
+              duration-500 dark:-rotate-90 dark:scale-0 dark:text-neutral-200'
           />
           <Moon
-            className='absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0
-              dark:scale-100'
+            className='absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 text-neutral-600 transition-all
+              duration-500 dark:rotate-0 dark:scale-100 dark:text-neutral-200'
           />
         </button>
       </DropdownMenuTrigger>
       <DropdownMenuContent
         align='end'
-        className='min-w-[120px] rounded-md border shadow-lg'
+        className='border-neutral-350 min-w-[120px] rounded-md border bg-white shadow-lg
+          dark:border-neutral-800 dark:bg-neutral-950'
       >
         <DropdownMenuItem
-          className='cursor-pointer px-4 py-2 text-sm'
+          className='cursor-pointer px-4 py-2 text-sm text-neutral-600 transition-colors
+            hover:bg-neutral-100 focus:outline-none dark:text-neutral-200
+            dark:hover:bg-neutral-800'
           onClick={() => setTheme('light')}
         >
           Light
         </DropdownMenuItem>
         <DropdownMenuItem
-          className='cursor-pointer px-4 py-2 text-sm'
+          className='cursor-pointer px-4 py-2 text-sm text-neutral-600 transition-colors
+            hover:bg-neutral-100 focus:outline-none dark:text-neutral-200
+            dark:hover:bg-neutral-800'
           onClick={() => setTheme('dark')}
         >
           Dark
         </DropdownMenuItem>
         <DropdownMenuItem
-          className='cursor-pointer px-4 py-2 text-sm'
+          className='cursor-pointer px-4 py-2 text-sm text-neutral-600 transition-colors
+            hover:bg-neutral-100 focus:outline-none dark:text-neutral-200
+            dark:hover:bg-neutral-800'
           onClick={() => setTheme('system')}
         >
           System