diff --git a/style.css b/style.css
index 2db6c49..ea74e4e 100644
--- a/style.css
+++ b/style.css
@@ -1,8 +1,13 @@
 @import url("navbar.css");
 
 :root {
-  --white: #fff;
-  --black: #000;
+  --white: 255, 255, 255;
+  --whitebg: 250, 250, 250;
+  --black: 0, 0, 0;
+  --blackbg: 34, 34, 34;
+  --accent1: 153, 193, 241;
+  --accent3: 53, 132, 228;
+  --accent5: 26, 95, 180;
   font-family: system-ui;
 }
 
@@ -98,8 +103,8 @@ h1 {margin-top: 3vh;}
   width: auto;
   height: 44px;
   border-radius: 22px;
-  background-color: rgba(53, 132, 228, 1);
-  color: var(--white);
+  background-color: rgb(var(--accent3));
+  color: rgb(var(--white));
   text-decoration: none;
   font-weight: bold;
   display: flex;
@@ -118,12 +123,12 @@ h1 {margin-top: 3vh;}
   padding: 10px 10px;
   margin-right: 0.25cm;
   margin-bottom: 0.25cm;
-  transition-duration: 0.2s;
-  background-color: rgba(53, 132, 228, 1);
-  color: var(--white);
+  transition-duration: 0.2s;;
+  background-color: rgb(var(--accent3));
+  color: rgb(var(--white));
 }
 
-.gtk-button:hover {background-color: rgba(53, 132, 228, 0.9);}
+.gtk-button:hover {background-color: rgba(var(--accent3), 0.9);}
 
 .itemcard {
   display: grid;
@@ -247,34 +252,33 @@ h1 {margin-top: 3vh;}
 }
 
 @media (prefers-color-scheme: light) {
-  body {background-color: #fafafa;}
-  html * {color: var(--black);}
-  .list {background-color: var(--white);}
-  .button {background-color: rgba(0, 0, 0, 0.08);}
-  .button:hover {background-color: rgba(0, 0, 0, 0.18);}
-  .togglegroups-background {background-color: rgba(0, 0, 0, 0.08);}
-  .togglegroups-highlighted {
-    background-color: var(--white);
-  }
-  .itemcard {background-color: var(--white);}
-  .itemcard:hover {background-color: #fafafa;}
-  .itemcard-stealth:hover {background-color: #e0e0e0;}
-  .infocard {background-color: var(--white);}
-  .separator {background-color: rgba(237, 237, 237, 1);}
-  .banner {background-color: #BFD7F3;}
+  body {background-color: rgb(var(--whitebg));}
+  html * {color: rgb(var(--black));}
+  .list {background-color: rgb(var(--white));}
+  .button {background-color: rgba(var(--black), 0.08);}
+  .button:hover {background-color: rgba(var(--black), 0.18);}
+  .togglegroups-background {background-color: rgba(var(--black), 0.08);}
+  .togglegroups-highlighted {background-color: rgb(var(--white));}
+  .itemcard {background-color: rgb(var(--white));}
+  .itemcard:hover {background-color: rgb(var(--whitebg));}
+  .itemcard-stealth:hover {background-color: rgba(var(--black), 0.1);}
+  .infocard {background-color: rgb(var(--white));}
+  .separator {background-color: rgb(var(--whitebg));}
+  .banner {background-color: rgba(var(--accent1), 0.6);}
 }
 
 @media (prefers-color-scheme: dark) {
-  body {background-color: #222222;}
-  html * {color: var(--white);}
-  .list {background-color: #363636;}
-  .button {background: rgba(255, 255, 255, 0.1);}
-  .button:hover {background: rgba(255, 255, 255, 0.18);}
-  .togglegroups-background {background: rgba(255, 255, 255, 0.1);}
-  .itemcard {background-color: #303030;}
-  .itemcard:hover {background-color: #4a4a4a;}
-  .itemcard-stealth:hover {background-color: #4a4a4a;}
-  .infocard {background-color: #303030;}
-  .separator {background-color: #232323;}
-  .banner {background-color: #29415E;}
+  body {background-color: rgb(var(--blackbg));}
+  html * {color: rgb(var(--white));}
+  .list {background-color: rgba(var(--white), 0.07);}
+  .button {background: rgba(var(--white), 0.1);}
+  .button:hover {background: rgba(var(--white), 0.18);}
+  .togglegroups-background {background: rgba(var(--white), 0.1);}
+  .togglegroups-highlighted {background-color: rgba(var(--white), 0.07);}
+  .itemcard {background-color: rgba(var(--white), 0.07);}
+  .itemcard:hover {background-color: rgba(var(--white), 0.15);}
+  .itemcard-stealth:hover {background-color: rgba(var(--white), 0.15);}
+  .infocard {background-color: rgba(var(--white), 0.07);}
+  .separator {background-color: rgb(var(--blackbg));}
+  .banner {background-color: rgba(var(--accent5), 0.5);}
 }