diff --git a/modules/bar/Workspaces.qml b/modules/bar/Workspaces.qml
index 36210dc..47a0542 100644
--- a/modules/bar/Workspaces.qml
+++ b/modules/bar/Workspaces.qml
@@ -8,7 +8,7 @@ import qs.reusables
 
 Rectangle {
     id: root
-    color: Colors.surfaceContainer
+    color: "transparent"
 
     implicitWidth: workspaceRow.implicitWidth + 10
     implicitHeight: Settings.config.barHeight - 10
@@ -40,7 +40,7 @@ Rectangle {
                 required property var modelData
                 width: !modelData.focused ? 20 : 40
                 height: isOnMon ? Settings.config.barHeight - Settings.config.barHeight / 2 : 0
-                color: modelData.focused ? Colors.primaryContainer : Colors.surfaceContainer
+                color: modelData.focused ? Colors.primaryContainer : "transparent"
                 Behavior on width {
                     NumberAnimation {
 
diff --git a/reusables/CustomIcon.qml b/reusables/CustomIcon.qml
index 536573f..8809f2f 100644
--- a/reusables/CustomIcon.qml
+++ b/reusables/CustomIcon.qml
@@ -1,7 +1,8 @@
 import QtQuick
 import qs
 
-CustomText {
+Text {
+	color: Colors.onSurfaceColor
     id: root
     property real iconSize: 16
     property real fill: 1