diff --git a/Colors.qml b/Colors.qml
index 541f5b5..29743ec 100644
--- a/Colors.qml
+++ b/Colors.qml
@@ -8,6 +8,11 @@ Singleton {
     id: root
 
     // --- The Backgrounds (Darkest to Lightest) ---
+    readonly property color accent: base0D
+    readonly property color barBg: base00
+    readonly property color moduleBg: base02
+    readonly property color activeModuleBg: base03
+    readonly property color text: base07
     readonly property color base00: "#" + viewer.base00
     readonly property color base01: "#" + viewer.base01
     readonly property color base02: "#" + viewer.base02
diff --git a/modules/bar/ActiveWindow.qml b/modules/bar/ActiveWindow.qml
index 389cf47..930179d 100644
--- a/modules/bar/ActiveWindow.qml
+++ b/modules/bar/ActiveWindow.qml
@@ -23,7 +23,7 @@ Rectangle {
     }
     implicitHeight: moduleHeight
     implicitWidth: titleLayout.width + 32
-    color: Colors.base02
+    color: Colors.moduleBg
     radius: Config.rounding
     RowLayout {
         id: titleLayout
diff --git a/modules/bar/Bar.qml b/modules/bar/Bar.qml
index ef05e9d..9b7d1c8 100644
--- a/modules/bar/Bar.qml
+++ b/modules/bar/Bar.qml
@@ -30,7 +30,7 @@ Variants {
         Rectangle {
             id: container
             radius: Config.floating ? Config.rounding : 0
-            color: Qt.rgba(Colors.base00.r, Colors.base00.g, Colors.base00.b, Config.opacity)
+            color: Qt.rgba(Colors.barBg.r, Colors.barBg.g, Colors.barBg.b, Config.opacity)
             anchors.fill: parent
             RowLayout {
                 id: leftLayout
diff --git a/modules/bar/Bat.qml b/modules/bar/Bat.qml
index 3c2e751..77ae4e6 100644
--- a/modules/bar/Bat.qml
+++ b/modules/bar/Bat.qml
@@ -19,7 +19,7 @@ Rectangle {
         shadowColor: "#020202"
     }
     clip: true
-    color: Colors.base02
+    color: Colors.moduleBg
     visible: UPower.displayDevice.isLaptopBattery
     property double percent: UPower.displayDevice.percentage * 100
     property bool hasBattery: UPower.displayDevice.isLaptopBattery
diff --git a/modules/bar/Clock.qml b/modules/bar/Clock.qml
index 94251cf..a44ad7b 100644
--- a/modules/bar/Clock.qml
+++ b/modules/bar/Clock.qml
@@ -22,7 +22,7 @@ Rectangle {
     required property double moduleHeight
     implicitHeight: moduleHeight
     implicitWidth: clockText.implicitWidth + 32
-    color: Colors.base02
+    color: Colors.moduleBg
     radius: Config.rounding
     SystemClock {
         id: clock
diff --git a/modules/bar/Mpris.qml b/modules/bar/Mpris.qml
index 4fec34b..c60ebf1 100644
--- a/modules/bar/Mpris.qml
+++ b/modules/bar/Mpris.qml
@@ -31,7 +31,7 @@ Rectangle {
     }
     visible: spotify !== null && spotify.playbackState === MprisPlaybackState.Playing
     clip: true
-    color: Colors.base02
+    color: Colors.moduleBg
     radius: Config.rounding
     RowLayout {
         id: songLayout
diff --git a/modules/bar/Pw.qml b/modules/bar/Pw.qml
index 832e5b7..b04731f 100644
--- a/modules/bar/Pw.qml
+++ b/modules/bar/Pw.qml
@@ -20,7 +20,7 @@ Rectangle {
         shadowOpacity: 0.5
         shadowColor: "#020202"
     }
-    color: clickHandler.containsMouse ? Colors.base03 : Colors.base02
+    color: clickHandler.containsMouse ? Colors.activeModuleBg : Colors.moduleBg
     property PwNode defaultAudio: Pipewire.ready ? Pipewire.defaultAudioSink : null
     property bool mute: Pipewire.ready ? defaultAudio?.audio.muted : null
     radius: Config.rounding
diff --git a/modules/bar/Tray.qml b/modules/bar/Tray.qml
index 03ccc03..12668e8 100644
--- a/modules/bar/Tray.qml
+++ b/modules/bar/Tray.qml
@@ -25,7 +25,7 @@ Rectangle {
     required property double moduleHeight
     implicitHeight: moduleHeight
     implicitWidth: iconlayout.width + 16
-    color: Colors.base02
+    color: Colors.moduleBg
     radius: Config.rounding
 
     RowLayout {
diff --git a/modules/bar/Ws.qml b/modules/bar/Ws.qml
index cc4d824..579ea2c 100644
--- a/modules/bar/Ws.qml
+++ b/modules/bar/Ws.qml
@@ -42,9 +42,8 @@ Rectangle {
                     id: wsName
                     anchors.centerIn: parent
                     text: wsWrapper.modelData.name
-                    color: wsWrapper.active ? Colors.base0D : Colors.base04
-                    opacity: wsWrapper.active ? 1.0 : 0.4
-                    font.bold: wsWrapper.active
+                    color: wsWrapper.active ? Colors.base0D : Colors.activeModuleBg
+                    font.bold: true
                 }
                 MouseArea {
                     id: clickHandler
diff --git a/modules/wallpaper/WallpaperPicker.qml b/modules/wallpaper/WallpaperPicker.qml
index c510645..784f0f3 100644
--- a/modules/wallpaper/WallpaperPicker.qml
+++ b/modules/wallpaper/WallpaperPicker.qml
@@ -26,7 +26,7 @@ Rectangle {
     }
     required property real moduleHeight
     required property int screenHeight
-    color: Colors.base02
+    color: Colors.moduleBg
     radius: Config.rounding
     implicitWidth: moduleHeight
     implicitHeight: moduleHeight
diff --git a/widgets/MaterialIcon.qml b/widgets/MaterialIcon.qml
index 6db34c6..fc1c72a 100644
--- a/widgets/MaterialIcon.qml
+++ b/widgets/MaterialIcon.qml
@@ -4,7 +4,7 @@ import QtQuick
 
 Text {
     font.family: "Material Symbols Rounded"
-    color: Colors.base05
+    color: Colors.text
     font.pixelSize: Config.iconSize
     property bool fill: true
     renderType: Text.NativeRendering
diff --git a/widgets/StyledText.qml b/widgets/StyledText.qml
index 8f3cd00..09982a5 100644
--- a/widgets/StyledText.qml
+++ b/widgets/StyledText.qml
@@ -5,5 +5,5 @@ import qs.settings
 Text {
     font.family: Config.font
     font.pixelSize: Config.fontSize
-    color: Colors.base05
+    color: Colors.text
 }