diff --git a/src/renderer/src/assets/main.css b/src/renderer/src/assets/main.css
index 0f569d1..e92ca33 100644
--- a/src/renderer/src/assets/main.css
+++ b/src/renderer/src/assets/main.css
@@ -34,6 +34,9 @@
     --ring: 240 10% 3.9%;
  
     --radius: 0.5rem;
+
+    --scrollbar-foreground: rgb(39 39 42);
+    --scrollbar-background: transparent;
   }
  
   .dark {
diff --git a/src/renderer/src/components/profile/ProfileButton.vue b/src/renderer/src/components/profile/ProfileButton.vue
index 5adaf2f..f8a1846 100644
--- a/src/renderer/src/components/profile/ProfileButton.vue
+++ b/src/renderer/src/components/profile/ProfileButton.vue
@@ -3,7 +3,7 @@
     class="m-2 flex h-12 overflow-hidden rounded-lg transition-all"
     :class="{
       'border border-zinc-100 bg-zinc-300': selected,
-      'border border-transparent hover:border-zinc-900': !selected,
+      'border border-transparent bg-zinc-900/30 hover:border-zinc-900': !selected,
       group: showHoverButtons
     }"
   >
@@ -26,7 +26,7 @@
         class="h-full min-w-0 flex-1 rounded-lg bg-transparent pl-8 text-sm transition-all focus-visible:outline-none focus-visible:ring-0"
         :class="{
           'bg-zinc-300 font-semibold text-black hover:bg-zinc-200': selected,
-          'text-muted-foreground hover:bg-zinc-900/50': !selected
+          'text-muted-foreground hover:bg-zinc-900': !selected
         }"
         @blur="onNameInputBlur"
       />
@@ -35,7 +35,7 @@
         type="submit"
         :class="{
           'bg-zinc-300 text-black hover:bg-zinc-200': selected,
-          'bg-zinc-900/50 text-zinc-100 hover:bg-zinc-900': !selected
+          'text-zinc-100 hover:bg-zinc-900': !selected
         }"
         class="flex aspect-square h-full shrink-0 items-center justify-center rounded-lg transition-all"
       >
@@ -47,7 +47,7 @@
       v-else
       :class="{
         'bg-zinc-300 font-semibold text-black hover:bg-zinc-200': selected,
-        'bg-zinc-900/50 text-muted-foreground hover:bg-zinc-900': !selected
+        'text-muted-foreground hover:bg-zinc-900': !selected
       }"
       class="h-12 flex-1 truncate rounded-lg pr-4 text-left text-sm transition-all"
       @click="!editing && $emit('select') && $refs.profileTitle.scramble()"
@@ -74,7 +74,7 @@
         v-if="nameEditable"
         :class="{
           'bg-zinc-300 text-black hover:bg-zinc-200': selected,
-          'bg-zinc-900/50 text-zinc-100 hover:bg-zinc-900': !selected,
+          'text-zinc-100 hover:bg-zinc-900': !selected,
           'group-hover:w-12': !editing
         }"
         class="flex h-12 w-0 shrink-0 items-center justify-center rounded-lg transition-all"
@@ -85,7 +85,7 @@
       <button
         :class="{
           'bg-zinc-300 text-black hover:bg-zinc-200': selected,
-          'bg-zinc-900/50 text-zinc-100 hover:bg-zinc-900': !selected,
+          'text-zinc-100 hover:bg-zinc-900': !selected,
           'group-hover:w-12': !editing,
           'rounded-l-lg': !nameEditable
         }"
@@ -121,7 +121,7 @@
       <button
         :class="{
           'bg-zinc-300 text-black hover:bg-zinc-200': selected,
-          'bg-zinc-900/50 text-zinc-100 hover:bg-zinc-900': !selected,
+          'text-zinc-100 hover:bg-zinc-900': !selected,
           'group-hover:w-12': !editing
         }"
         class="flex h-12 w-0 shrink-0 items-center justify-center rounded-lg transition-all"