diff --git a/apps/client/src/app/components/admin-settings/admin-settings.component.scss b/apps/client/src/app/components/admin-settings/admin-settings.component.scss
index 1c0a17624..29340ea0d 100644
--- a/apps/client/src/app/components/admin-settings/admin-settings.component.scss
+++ b/apps/client/src/app/components/admin-settings/admin-settings.component.scss
@@ -10,7 +10,33 @@
   }
 
   .mat-mdc-card {
-    --mat-card-outlined-container-color: whitesmoke;
+    --gradient-opacity: 50%;
+    --mat-card-outlined-outline-color: rgb(193, 219, 254);
+
+    background-color: white;
+    background-image: linear-gradient(
+      109.6deg,
+      color-mix(in srgb, rgba(255, 255, 255, 1) 100%, transparent) 11.2%,
+      color-mix(
+          in srgb,
+          rgba(221, 108, 241, 0.26) var(--gradient-opacity),
+          transparent
+        )
+        42%,
+      color-mix(
+          in srgb,
+          rgba(229, 106, 253, 0.71) var(--gradient-opacity),
+          transparent
+        )
+        71.5%,
+      color-mix(
+          in srgb,
+          rgba(123, 183, 253, 1) var(--gradient-opacity),
+          transparent
+        )
+        100%
+    );
+    color: rgb(var(--dark-primary-text));
 
     .mat-mdc-card-actions {
       min-height: 0;
@@ -32,6 +58,6 @@
 
 :host-context(.theme-dark) {
   .mat-mdc-card {
-    --mat-card-outlined-container-color: #222222;
+    --mat-card-outlined-outline-color: white;
   }
 }