diff --git a/app/assets/stylesheets/application.bootstrap.scss b/app/assets/stylesheets/application.bootstrap.scss
index 9a4dab5e1074250c70e22220460047df135149f8..62ed82a6e6cf0170d15c4d3c66e15da3a619fff9 100644
--- a/app/assets/stylesheets/application.bootstrap.scss
+++ b/app/assets/stylesheets/application.bootstrap.scss
@@ -211,21 +211,25 @@ input.search-bar {
 }
 
 #nav-user-dropdown {
-  padding: 6px;
+  padding: 6px 0px 6px 6px;
   border-radius: $border-radius;
+
   &:hover {
-    color: var(--brand-color);
-    background-color: var(--brand-color-light);
+    background-color: white;
+    color: black !important;
   }
   &:active {
-    background-color: var(--brand-color-light) !important;
+    background-color: white !important;
   }
   &:focus {
-    background-color: var(--brand-color-light) !important;
+    background-color: white !important;
   }
   &::after {
     display: none;
   }
+  #chevron-profile {
+    padding-top: 2px;
+  }
 }
 
 .dropdown-menu.show {
diff --git a/app/javascript/components/home/NavbarSignedIn.jsx b/app/javascript/components/home/NavbarSignedIn.jsx
index 98679cb7504c2bd081b2a05ff175a4b4e638d11f..ddc6b45eed5fbea947699980e2b24f4c2796494a 100644
--- a/app/javascript/components/home/NavbarSignedIn.jsx
+++ b/app/javascript/components/home/NavbarSignedIn.jsx
@@ -73,8 +73,8 @@ export default function NavbarSignedIn({ currentUser }) {
           title={(
             <Stack direction="horizontal" gap={2}>
               <Avatar avatar={currentUser?.avatar} size="small" />
-              <span className="text-brand ms-1">{currentUser?.name}</span>
-              <ChevronDownIcon className="hi-s text-muted" />
+              <span className="ms-1">{currentUser?.name}</span>
+              <ChevronDownIcon id="chevron-profile" className="hi-s text-muted" />
             </Stack>
           )}
           id="nav-user-dropdown"