diff --git a/Colors.qml b/Colors.qml
index 9fe1866..78950d5 100644
--- a/Colors.qml
+++ b/Colors.qml
@@ -8,26 +8,26 @@ import qs.settings
 Singleton {
     id: root
     property alias c: colorsProxy
-    property string font: colorsProxy.base06
-    property string accent: colorsProxy[Config.cfg.appearance.accent]
+    property color  font: colorsProxy.base06
+    property color  accent: colorsProxy[Config.cfg.appearance.accent]
     QtObject {
         id: colorsProxy
-	property string base00: "#" + colors.base00
-	property string base01: "#" + colors.base01
-	property string base02: "#" + colors.base02
-	property string base03: "#" + colors.base03
-	property string base04: "#" + colors.base04
-	property string base05: "#" + colors.base05
-	property string base06: "#" + colors.base06
-	property string base07: "#" + colors.base07
-	property string base08: "#" + colors.base08
-	property string base09: "#" + colors.base09
-	property string base0A: "#" + colors.base0A
-	property string base0B: "#" + colors.base0B
-	property string base0C: "#" + colors.base0C
-	property string base0D: "#" + colors.base0D
-	property string base0E: "#" + colors.base0E
-	property string base0F: "#" + colors.base0F
+	property color  base00: "#" + colors.base00
+	property color  base01: "#" + colors.base01
+	property color  base02: "#" + colors.base02
+	property color  base03: "#" + colors.base03
+	property color  base04: "#" + colors.base04
+	property color  base05: "#" + colors.base05
+	property color  base06: "#" + colors.base06
+	property color  base07: "#" + colors.base07
+	property color  base08: "#" + colors.base08
+	property color  base09: "#" + colors.base09
+	property color  base0A: "#" + colors.base0A
+	property color  base0B: "#" + colors.base0B
+	property color  base0C: "#" + colors.base0C
+	property color  base0D: "#" + colors.base0D
+	property color  base0E: "#" + colors.base0E
+	property color  base0F: "#" + colors.base0F
 	
 	
     }
diff --git a/widgets/BarComponent.qml b/widgets/BarComponent.qml
index 5805974..aa55b7b 100644
--- a/widgets/BarComponent.qml
+++ b/widgets/BarComponent.qml
@@ -4,8 +4,13 @@ import qs
 import qs.settings
 
 Rectangle {
-    property color base: active ? Colors.c.base02 : Colors.c.base01
+    id: root
+    readonly property color barColor: Colors.c.base00
+    property real lightnessBoost: 0.07
+    property real activeBoost: 0.06
     property bool active: false
+    readonly property real baseLightness: Math.min(1.0, barColor.hslLightness + lightnessBoost)
+    property color base: Qt.hsla(barColor.hslHue, barColor.hslSaturation, active ? Math.min(1.0, baseLightness + activeBoost) : baseLightness)
     color: base
     implicitHeight: Config.cfg.bar.height - 8
     radius: Config.cfg.appearance.rounding - 4