diff --git a/src/frontend/src/components/cardComponent/index.tsx b/src/frontend/src/components/cardComponent/index.tsx
index 0e2e2e09f..d169a598a 100644
--- a/src/frontend/src/components/cardComponent/index.tsx
+++ b/src/frontend/src/components/cardComponent/index.tsx
@@ -217,7 +217,7 @@ export default function CollectionCardComponent({
         data-testid={`card-${convertTestName(data.name)}`}
         //TODO check color schema
         className={cn(
-          "group relative flex h-[11rem] flex-col justify-between overflow-hidden transition-all hover:bg-muted/50 hover:shadow-md hover:dark:bg-[#ffffff10]",
+          "group relative flex h-[11rem] flex-col justify-between overflow-hidden hover:bg-muted/50 hover:shadow-md hover:dark:bg-[#5f5f5f0e]",
           disabled ? "pointer-events-none opacity-50" : "",
           onClick ? "cursor-pointer" : "",
           isSelectedCard ? "border border-selected" : "",
diff --git a/src/frontend/src/style/index.css b/src/frontend/src/style/index.css
index 80faa80b5..fd1ce0912 100644
--- a/src/frontend/src/style/index.css
+++ b/src/frontend/src/style/index.css
@@ -69,7 +69,7 @@
   }
 
   .dark {
-    --background: 224 35% 7.5%; /* hsl(224 40% 10%) */
+    --background: 224 28% 7.5%; /* hsl(224 10% 7.5%) */
     --foreground: 213 31% 80%; /* hsl(213 31% 91%) */
     --ice: #60a5fa;
     --hover: #1a202e;
@@ -91,7 +91,7 @@
     --primary: 210 20% 80%; /* hsl(210 20% 80%) */
     --primary-foreground: 222.2 27.4% 1.2%; /* hsl(222 47% 1%) */
 
-    --secondary: 222.2 37.4% 7.2%; /* hsl(222 47% 11%) */
+    --secondary: 222.2 30.4% 7.2%; /* hsl(222 47% 11%) */
     --secondary-foreground: 210 40% 80%; /* hsl(210 40% 80%) */
 
     --accent: 216 24% 20%; /* hsl(216 34% 17%) */