diff --git a/.config/quickshell/modules/backgroundWidgets/BackgroundWidgets.qml b/.config/quickshell/modules/backgroundWidgets/BackgroundWidgets.qml
index 3fb5471df..b6add8968 100644
--- a/.config/quickshell/modules/backgroundWidgets/BackgroundWidgets.qml
+++ b/.config/quickshell/modules/backgroundWidgets/BackgroundWidgets.qml
@@ -17,17 +17,17 @@ Scope {
     property string filePath: `${Directories.state}/user/generated/wallpaper/least_busy_region.json`
     property real centerX: 0
     property real centerY: 0
-    property color dominantColor: Appearance.m3colors.m3primary
+    property color dominantColor: Appearance.colors.colPrimary
     property bool dominantColorIsDark: dominantColor.hslLightness < 0.5
-    property color colBackground: ColorUtils.transparentize(ColorUtils.mix(Appearance.m3colors.m3primary, Appearance.m3colors.m3secondaryContainer), 1)
-    property color colText: ColorUtils.colorWithLightness(Appearance.m3colors.m3primary, (root.dominantColorIsDark ? 0.8 : 0.12))
+    property color colBackground: ColorUtils.transparentize(ColorUtils.mix(Appearance.colors.colPrimary, Appearance.colors.colSecondaryContainer), 1)
+    property color colText: ColorUtils.colorWithLightness(Appearance.colors.colPrimary, (root.dominantColorIsDark ? 0.8 : 0.12))
 
     function updateWidgetPosition(fileContent) {
         // console.log("[BackgroundWidgets] Updating widget position with content:", fileContent)
         const parsedContent = JSON.parse(fileContent)
         root.centerX = parsedContent.center_x
         root.centerY = parsedContent.center_y
-        root.dominantColor = parsedContent.dominant_color || Appearance.m3colors.m3primary
+        root.dominantColor = parsedContent.dominant_color || Appearance.colors.colPrimary
     }
     
     Timer {
diff --git a/.config/quickshell/modules/bar/Bar.qml b/.config/quickshell/modules/bar/Bar.qml
index 88a605fe1..e9efa4b1c 100644
--- a/.config/quickshell/modules/bar/Bar.qml
+++ b/.config/quickshell/modules/bar/Bar.qml
@@ -24,7 +24,7 @@ Scope {
         Layout.bottomMargin: barHeight / 3
         Layout.fillHeight: true
         implicitWidth: 1
-        color: Appearance.m3colors.m3outlineVariant
+        color: Appearance.colors.colOutlineVariant
     }
 
     Variants { // For each monitor
@@ -149,7 +149,7 @@ Scope {
                                 colBackground: barLeftSideMouseArea.hovered ? Appearance.colors.colLayer1Hover : ColorUtils.transparentize(Appearance.colors.colLayer1Hover, 1)
                                 colBackgroundHover: Appearance.colors.colLayer1Hover
                                 colRipple: Appearance.colors.colLayer1Active
-                                colBackgroundToggled: Appearance.m3colors.m3secondaryContainer
+                                colBackgroundToggled: Appearance.colors.colSecondaryContainer
                                 colBackgroundToggledHover: Appearance.colors.colSecondaryContainerHover
                                 colRippleToggled: Appearance.colors.colSecondaryContainerActive
                                 toggled: GlobalStates.sidebarLeftOpen
@@ -346,7 +346,7 @@ Scope {
                                 colBackground: barRightSideMouseArea.hovered ? Appearance.colors.colLayer1Hover : ColorUtils.transparentize(Appearance.colors.colLayer1Hover, 1)
                                 colBackgroundHover: Appearance.colors.colLayer1Hover
                                 colRipple: Appearance.colors.colLayer1Active
-                                colBackgroundToggled: Appearance.m3colors.m3secondaryContainer
+                                colBackgroundToggled: Appearance.colors.colSecondaryContainer
                                 colBackgroundToggledHover: Appearance.colors.colSecondaryContainerHover
                                 colRippleToggled: Appearance.colors.colSecondaryContainerActive
                                 toggled: GlobalStates.sidebarRightOpen
diff --git a/.config/quickshell/modules/bar/BatteryIndicator.qml b/.config/quickshell/modules/bar/BatteryIndicator.qml
index 74cdf0169..271cd8c28 100644
--- a/.config/quickshell/modules/bar/BatteryIndicator.qml
+++ b/.config/quickshell/modules/bar/BatteryIndicator.qml
@@ -48,7 +48,7 @@ Rectangle {
             lineWidth: 2
             value: percentage
             size: 26
-            secondaryColor: (isLow && !isCharging) ? batteryLowBackground : Appearance.m3colors.m3secondaryContainer
+            secondaryColor: (isLow && !isCharging) ? batteryLowBackground : Appearance.colors.colSecondaryContainer
             primaryColor: (isLow && !isCharging) ? batteryLowOnBackground : Appearance.m3colors.m3onSecondaryContainer
             fill: (isLow && !isCharging)
 
diff --git a/.config/quickshell/modules/bar/Media.qml b/.config/quickshell/modules/bar/Media.qml
index c59b6379d..d105ea203 100644
--- a/.config/quickshell/modules/bar/Media.qml
+++ b/.config/quickshell/modules/bar/Media.qml
@@ -62,7 +62,7 @@ Item {
             lineWidth: 2
             value: activePlayer?.position / activePlayer?.length
             size: 26
-            secondaryColor: Appearance.m3colors.m3secondaryContainer
+            secondaryColor: Appearance.colors.colSecondaryContainer
             primaryColor: Appearance.m3colors.m3onSecondaryContainer
 
             MaterialSymbol {
diff --git a/.config/quickshell/modules/bar/Resource.qml b/.config/quickshell/modules/bar/Resource.qml
index 18fdcba42..2b2dd0b60 100644
--- a/.config/quickshell/modules/bar/Resource.qml
+++ b/.config/quickshell/modules/bar/Resource.qml
@@ -23,7 +23,7 @@ Item {
             lineWidth: 2
             value: percentage
             size: 26
-            secondaryColor: Appearance.m3colors.m3secondaryContainer
+            secondaryColor: Appearance.colors.colSecondaryContainer
             primaryColor: Appearance.m3colors.m3onSecondaryContainer
 
             MaterialSymbol {
diff --git a/.config/quickshell/modules/bar/Workspaces.qml b/.config/quickshell/modules/bar/Workspaces.qml
index cb3c6551a..b95526375 100644
--- a/.config/quickshell/modules/bar/Workspaces.qml
+++ b/.config/quickshell/modules/bar/Workspaces.qml
@@ -109,7 +109,7 @@ Item {
                 topRightRadius: radiusRight
                 bottomRightRadius: radiusRight
                 
-                color: ColorUtils.transparentize(Appearance.m3colors.m3secondaryContainer, 0.4)
+                color: ColorUtils.transparentize(Appearance.colors.colSecondaryContainer, 0.4)
                 opacity: (workspaceOccupied[index] && !(!activeWindow?.activated && monitor.activeWorkspace?.id === index+1)) ? 1 : 0
 
                 Behavior on opacity {
diff --git a/.config/quickshell/modules/common/Appearance.qml b/.config/quickshell/modules/common/Appearance.qml
index a984b9e4f..97a8502ff 100644
--- a/.config/quickshell/modules/common/Appearance.qml
+++ b/.config/quickshell/modules/common/Appearance.qml
@@ -15,11 +15,11 @@ Singleton {
     property QtObject sizes
     property string syntaxHighlightingTheme
 
-    // [!] Enabling transparency can affect readability when using light theme.
+    // Extremely conservative transparency values for consistency and readability
     property real transparency: 0
     property real contentTransparency: 0
-    // property real transparency: 0.15
-    // property real contentTransparency: 0.5
+    // property real transparency: m3colors.darkmode ? 0.05 : 0
+    // property real contentTransparency: m3colors.darkmode ? 0.18 : 0
 
     m3colors: QtObject {
         property bool darkmode: false
@@ -106,10 +106,10 @@ Singleton {
         property color colOnLayer0: m3colors.m3onBackground
         property color colLayer0Hover: ColorUtils.transparentize(ColorUtils.mix(colLayer0, colOnLayer0, 0.9, root.contentTransparency))
         property color colLayer0Active: ColorUtils.transparentize(ColorUtils.mix(colLayer0, colOnLayer0, 0.8, root.contentTransparency))
-        property color colLayer1: ColorUtils.transparentize(ColorUtils.mix(m3colors.m3surfaceContainerLow, m3colors.m3background, 0.7), root.contentTransparency);
+        property color colLayer1: ColorUtils.transparentize(ColorUtils.mix(m3colors.m3surfaceContainerLow, m3colors.m3background, 0.8), root.contentTransparency);
         property color colOnLayer1: m3colors.m3onSurfaceVariant;
         property color colOnLayer1Inactive: ColorUtils.mix(colOnLayer1, colLayer1, 0.45);
-        property color colLayer2: ColorUtils.transparentize(ColorUtils.mix(m3colors.m3surfaceContainer, m3colors.m3surfaceContainerHigh, 0.55), root.contentTransparency)
+        property color colLayer2: ColorUtils.transparentize(ColorUtils.mix(m3colors.m3surfaceContainer, m3colors.m3surfaceContainerHigh, 0.7), root.contentTransparency)
         property color colOnLayer2: m3colors.m3onSurface;
         property color colOnLayer2Disabled: ColorUtils.mix(colOnLayer2, m3colors.m3background, 0.4);
         property color colLayer3: ColorUtils.transparentize(ColorUtils.mix(m3colors.m3surfaceContainerHigh, m3colors.m3onSurface, 0.96), root.contentTransparency)
@@ -127,16 +127,23 @@ Singleton {
         property color colPrimaryContainer: m3colors.m3primaryContainer
         property color colPrimaryContainerHover: ColorUtils.mix(colors.colPrimaryContainer, colLayer1Hover, 0.7)
         property color colPrimaryContainerActive: ColorUtils.mix(colors.colPrimaryContainer, colLayer1Active, 0.6)
+        property color colSecondary: m3colors.m3secondary
         property color colSecondaryHover: ColorUtils.mix(m3colors.m3secondary, colLayer1Hover, 0.85)
         property color colSecondaryActive: ColorUtils.mix(m3colors.m3secondary, colLayer1Active, 0.4)
+        property color colSecondaryContainer: ColorUtils.transparentize(m3colors.m3secondaryContainer, root.contentTransparency)
         property color colSecondaryContainerHover: ColorUtils.mix(m3colors.m3secondaryContainer, colLayer1Hover, 0.6)
         property color colSecondaryContainerActive: ColorUtils.mix(m3colors.m3secondaryContainer, colLayer1Active, 0.54)
+        property color colSurfaceContainerLow: ColorUtils.transparentize(m3colors.m3surfaceContainerLow, root.contentTransparency)
+        property color colSurfaceContainer: ColorUtils.transparentize(m3colors.m3surfaceContainer, root.contentTransparency)
+        property color colSurfaceContainerHigh: ColorUtils.transparentize(m3colors.m3surfaceContainerHigh, root.contentTransparency)
+        property color colSurfaceContainerHighest: ColorUtils.transparentize(m3colors.m3surfaceContainerHighest, root.contentTransparency)
         property color colSurfaceContainerHighestHover: ColorUtils.mix(m3colors.m3surfaceContainerHighest, m3colors.m3onSurface, 0.95)
         property color colSurfaceContainerHighestActive: ColorUtils.mix(m3colors.m3surfaceContainerHighest, m3colors.m3onSurface, 0.85)
         property color colTooltip: m3colors.darkmode ? ColorUtils.mix(m3colors.m3background, "#3C4043", 0.5) : "#3C4043" // m3colors.m3inverseSurface in the specs, but the m3 website actually uses #3C4043
         property color colOnTooltip: "#F8F9FA" // m3colors.m3inverseOnSurface in the specs, but the m3 website actually uses this color
         property color colScrim: ColorUtils.transparentize(m3colors.m3scrim, 0.5)
         property color colShadow: ColorUtils.transparentize(m3colors.m3shadow, 0.7)
+        property color colOutlineVariant: m3colors.m3outlineVariant
     }
 
     rounding: QtObject {
diff --git a/.config/quickshell/modules/common/widgets/CircularProgress.qml b/.config/quickshell/modules/common/widgets/CircularProgress.qml
index d0afc6060..c3731e64e 100644
--- a/.config/quickshell/modules/common/widgets/CircularProgress.qml
+++ b/.config/quickshell/modules/common/widgets/CircularProgress.qml
@@ -14,7 +14,7 @@ Item {
     property int lineWidth: 2
     property real value: 0
     property color primaryColor: Appearance.m3colors.m3onSecondaryContainer
-    property color secondaryColor: Appearance.m3colors.m3secondaryContainer
+    property color secondaryColor: Appearance.colors.colSecondaryContainer
     property real gapAngle: Math.PI / 9
     property bool fill: false
     property int fillOverflow: 2
diff --git a/.config/quickshell/modules/common/widgets/KeyboardKey.qml b/.config/quickshell/modules/common/widgets/KeyboardKey.qml
index d6ba5ba08..0cc80429e 100644
--- a/.config/quickshell/modules/common/widgets/KeyboardKey.qml
+++ b/.config/quickshell/modules/common/widgets/KeyboardKey.qml
@@ -15,7 +15,7 @@ Rectangle {
     property real extraBottomBorderWidth: 2
     property color borderColor: Appearance.colors.colOnLayer0
     property real borderRadius: 5
-    property color keyColor: Appearance.m3colors.m3surfaceContainerLow
+    property color keyColor: Appearance.colors.colSurfaceContainerLow
     implicitWidth: keyFace.implicitWidth + borderWidth * 2
     implicitHeight: keyFace.implicitHeight + borderWidth * 2 + extraBottomBorderWidth
     radius: borderRadius
diff --git a/.config/quickshell/modules/common/widgets/NavRailButton.qml b/.config/quickshell/modules/common/widgets/NavRailButton.qml
index 1f55ad282..0a241553f 100644
--- a/.config/quickshell/modules/common/widgets/NavRailButton.qml
+++ b/.config/quickshell/modules/common/widgets/NavRailButton.qml
@@ -30,7 +30,7 @@ Button {
             Layout.alignment: Qt.AlignHCenter
             radius: Appearance.rounding.full
             color: toggled ? 
-                (button.down ? Appearance.colors.colSecondaryContainerActive : button.hovered ? Appearance.colors.colSecondaryContainerHover : Appearance.m3colors.m3secondaryContainer) :
+                (button.down ? Appearance.colors.colSecondaryContainerActive : button.hovered ? Appearance.colors.colSecondaryContainerHover : Appearance.colors.colSecondaryContainer) :
                 (button.down ? Appearance.colors.colLayer1Active : button.hovered ? Appearance.colors.colLayer1Hover : ColorUtils.transparentize(Appearance.colors.colLayer1Hover, 1))
 
             Behavior on color {
diff --git a/.config/quickshell/modules/common/widgets/NotificationActionButton.qml b/.config/quickshell/modules/common/widgets/NotificationActionButton.qml
index 370814f91..e85735a71 100644
--- a/.config/quickshell/modules/common/widgets/NotificationActionButton.qml
+++ b/.config/quickshell/modules/common/widgets/NotificationActionButton.qml
@@ -15,7 +15,7 @@ RippleButton {
     leftPadding: 15
     rightPadding: 15
     buttonRadius: Appearance.rounding.small
-    colBackground: (urgency == NotificationUrgency.Critical) ? Appearance.m3colors.m3secondaryContainer : Appearance.m3colors.m3surfaceContainerHighest
+    colBackground: (urgency == NotificationUrgency.Critical) ? Appearance.colors.colSecondaryContainer : Appearance.colors.colSurfaceContainerHighest
     colBackgroundHover: (urgency == NotificationUrgency.Critical) ? Appearance.colors.colSecondaryContainerHover : Appearance.colors.colSurfaceContainerHighestHover
     colRipple: (urgency == NotificationUrgency.Critical) ? Appearance.colors.colSecondaryContainerActive : Appearance.colors.colSurfaceContainerHighestActive
 
diff --git a/.config/quickshell/modules/common/widgets/NotificationAppIcon.qml b/.config/quickshell/modules/common/widgets/NotificationAppIcon.qml
index 371093b25..81505aff6 100644
--- a/.config/quickshell/modules/common/widgets/NotificationAppIcon.qml
+++ b/.config/quickshell/modules/common/widgets/NotificationAppIcon.qml
@@ -26,7 +26,7 @@ Rectangle { // App icon
     implicitWidth: size
     implicitHeight: size
     radius: Appearance.rounding.full
-    color: Appearance.m3colors.m3secondaryContainer
+    color: Appearance.colors.colSecondaryContainer
     Loader {
         id: materialSymbolLoader
         active: root.appIcon == ""
diff --git a/.config/quickshell/modules/common/widgets/NotificationGroup.qml b/.config/quickshell/modules/common/widgets/NotificationGroup.qml
index cfe93327c..e79f400ae 100644
--- a/.config/quickshell/modules/common/widgets/NotificationGroup.qml
+++ b/.config/quickshell/modules/common/widgets/NotificationGroup.qml
@@ -113,7 +113,7 @@ Item { // Notification group area
         id: background
         anchors.left: parent.left
         width: parent.width
-        color: Appearance.m3colors.m3surfaceContainer
+        color: Appearance.colors.colSurfaceContainer
         radius: Appearance.rounding.normal
         anchors.leftMargin: root.xOffset
 
diff --git a/.config/quickshell/modules/common/widgets/NotificationItem.qml b/.config/quickshell/modules/common/widgets/NotificationItem.qml
index 26286290c..9a2a7c31d 100644
--- a/.config/quickshell/modules/common/widgets/NotificationItem.qml
+++ b/.config/quickshell/modules/common/widgets/NotificationItem.qml
@@ -129,9 +129,9 @@ Item { // Notification item area
 
         color: (expanded && !onlyNotification) ? 
             (notificationObject.urgency == NotificationUrgency.Critical) ? 
-                ColorUtils.mix(Appearance.m3colors.m3secondaryContainer, Appearance.colors.colLayer2, 0.35) :
-                (Appearance.m3colors.m3surfaceContainerHigh) :
-            ColorUtils.transparentize(Appearance.m3colors.m3surfaceContainerHighest)
+                ColorUtils.mix(Appearance.colors.colSecondaryContainer, Appearance.colors.colLayer2, 0.35) :
+                (Appearance.colors.colSurfaceContainerHigh) :
+            ColorUtils.transparentize(Appearance.colors.colSurfaceContainerHighest)
 
         implicitHeight: expanded ? (contentColumn.implicitHeight + padding * 2) : summaryRow.implicitHeight
         Behavior on implicitHeight {
diff --git a/.config/quickshell/modules/common/widgets/SelectionDialog.qml b/.config/quickshell/modules/common/widgets/SelectionDialog.qml
index affd13bc9..9cf0940ed 100644
--- a/.config/quickshell/modules/common/widgets/SelectionDialog.qml
+++ b/.config/quickshell/modules/common/widgets/SelectionDialog.qml
@@ -34,7 +34,7 @@ Item {
 
     Rectangle { // The dialog
         id: dialog
-        color: Appearance.m3colors.m3surfaceContainerHigh
+        color: Appearance.colors.colSurfaceContainerHigh
         radius: Appearance.rounding.normal
         anchors.fill: parent
         anchors.margins: dialogMargin
diff --git a/.config/quickshell/modules/common/widgets/StyledSlider.qml b/.config/quickshell/modules/common/widgets/StyledSlider.qml
index 70491b8bb..ca0980030 100644
--- a/.config/quickshell/modules/common/widgets/StyledSlider.qml
+++ b/.config/quickshell/modules/common/widgets/StyledSlider.qml
@@ -19,7 +19,7 @@ Slider {
     property real handleLimit: root.backgroundDotMargins
     property real trackHeight: 30 * scale
     property color highlightColor: Appearance.colors.colPrimary
-    property color trackColor: Appearance.m3colors.m3secondaryContainer
+    property color trackColor: Appearance.colors.colSecondaryContainer
     property color handleColor: Appearance.m3colors.m3onSecondaryContainer
     property real trackRadius: Appearance.rounding.verysmall * scale
     property real unsharpenRadius: Appearance.rounding.unsharpen
diff --git a/.config/quickshell/modules/common/widgets/StyledSwitch.qml b/.config/quickshell/modules/common/widgets/StyledSwitch.qml
index bbc2ae513..217a2f7e4 100644
--- a/.config/quickshell/modules/common/widgets/StyledSwitch.qml
+++ b/.config/quickshell/modules/common/widgets/StyledSwitch.qml
@@ -13,7 +13,7 @@ Switch {
     implicitHeight: 32 * root.scale
     implicitWidth: 52 * root.scale
     property color activeColor: Appearance?.colors.colPrimary ?? "#685496"
-    property color inactiveColor: Appearance?.m3colors.m3surfaceContainerHighest ?? "#45464F"
+    property color inactiveColor: Appearance?.colors.colSurfaceContainerHighest ?? "#45464F"
 
     PointingHandInteraction {}
 
diff --git a/.config/quickshell/modules/common/widgets/StyledTextArea.qml b/.config/quickshell/modules/common/widgets/StyledTextArea.qml
index 1ea9a349a..67d417576 100644
--- a/.config/quickshell/modules/common/widgets/StyledTextArea.qml
+++ b/.config/quickshell/modules/common/widgets/StyledTextArea.qml
@@ -5,7 +5,7 @@ import QtQuick.Controls
 TextArea {
     renderType: Text.NativeRendering
     selectedTextColor: Appearance.m3colors.m3onSecondaryContainer
-    selectionColor: Appearance.m3colors.m3secondaryContainer
+    selectionColor: Appearance.colors.colSecondaryContainer
     placeholderTextColor: Appearance.m3colors.m3outline
     font {
         family: Appearance?.font.family.main ?? "sans-serif"
diff --git a/.config/quickshell/modules/dock/DockAppButton.qml b/.config/quickshell/modules/dock/DockAppButton.qml
index 5ddb6d150..f4623e625 100644
--- a/.config/quickshell/modules/dock/DockAppButton.qml
+++ b/.config/quickshell/modules/dock/DockAppButton.qml
@@ -106,7 +106,7 @@ DockButton {
                         implicitWidth: (appToplevel.toplevels.length <= 3) ? 
                             root.countDotWidth : root.countDotHeight // Circles when too many
                         implicitHeight: root.countDotHeight
-                        color: appIsActive ? Appearance.m3colors.m3primary : ColorUtils.transparentize(Appearance.colors.colOnLayer0, 0.4)
+                        color: appIsActive ? Appearance.colors.colPrimary : ColorUtils.transparentize(Appearance.colors.colOnLayer0, 0.4)
                     }
                 }
             }
diff --git a/.config/quickshell/modules/dock/DockApps.qml b/.config/quickshell/modules/dock/DockApps.qml
index 8b680c51a..ffda024c7 100644
--- a/.config/quickshell/modules/dock/DockApps.qml
+++ b/.config/quickshell/modules/dock/DockApps.qml
@@ -166,7 +166,7 @@ Item {
                     animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
                 }
                 clip: true
-                color: Appearance.m3colors.m3surfaceContainer
+                color: Appearance.colors.colSurfaceContainer
                 radius: Appearance.rounding.normal
                 anchors.bottom: parent.bottom
                 anchors.bottomMargin: Appearance.sizes.elevationMargin
@@ -205,7 +205,7 @@ Item {
                                     contentWidth: parent.width - anchors.margins * 2
                                     WrapperRectangle {
                                         Layout.fillWidth: true
-                                        color: ColorUtils.transparentize(Appearance.m3colors.m3surfaceContainer)
+                                        color: ColorUtils.transparentize(Appearance.colors.colSurfaceContainer)
                                         radius: Appearance.rounding.small
                                         margin: 5
                                         StyledText {
@@ -218,7 +218,7 @@ Item {
                                     }
                                     GroupButton {
                                         id: closeButton
-                                        colBackground: ColorUtils.transparentize(Appearance.m3colors.m3surfaceContainer)
+                                        colBackground: ColorUtils.transparentize(Appearance.colors.colSurfaceContainer)
                                         baseWidth: windowControlsHeight
                                         baseHeight: windowControlsHeight
                                         buttonRadius: Appearance.rounding.full
diff --git a/.config/quickshell/modules/dock/DockSeparator.qml b/.config/quickshell/modules/dock/DockSeparator.qml
index 29b77d492..abb45d1da 100644
--- a/.config/quickshell/modules/dock/DockSeparator.qml
+++ b/.config/quickshell/modules/dock/DockSeparator.qml
@@ -9,5 +9,5 @@ Rectangle {
     Layout.bottomMargin: Appearance.sizes.hyprlandGapsOut + dockRow.padding + Appearance.rounding.normal
     Layout.fillHeight: true
     implicitWidth: 1
-    color: Appearance.m3colors.m3outlineVariant
+    color: Appearance.colors.colOutlineVariant
 }
diff --git a/.config/quickshell/modules/onScreenKeyboard/OnScreenKeyboard.qml b/.config/quickshell/modules/onScreenKeyboard/OnScreenKeyboard.qml
index 39862c55f..e78f45b2e 100644
--- a/.config/quickshell/modules/onScreenKeyboard/OnScreenKeyboard.qml
+++ b/.config/quickshell/modules/onScreenKeyboard/OnScreenKeyboard.qml
@@ -111,7 +111,7 @@ Scope { // Scope
                         Layout.bottomMargin: 20
                         Layout.fillHeight: true
                         implicitWidth: 1
-                        color: Appearance.m3colors.m3outlineVariant
+                        color: Appearance.colors.colOutlineVariant
                     }
                     OskContent {
                         id: oskContent
diff --git a/.config/quickshell/modules/overview/OverviewWidget.qml b/.config/quickshell/modules/overview/OverviewWidget.qml
index 1a9494938..9ab39fd02 100644
--- a/.config/quickshell/modules/overview/OverviewWidget.qml
+++ b/.config/quickshell/modules/overview/OverviewWidget.qml
@@ -25,7 +25,7 @@ Item {
     property var windowAddresses: HyprlandData.addresses
     property var monitorData: HyprlandData.monitors.find(m => m.id === root.monitor.id)
     property real scale: ConfigOptions.overview.scale
-    property color activeBorderColor: Appearance.m3colors.m3secondary
+    property color activeBorderColor: Appearance.colors.colSecondary
 
     property real workspaceImplicitWidth: (monitorData?.transform % 2 === 1) ? 
         ((monitor.height - monitorData?.reserved[0] - monitorData?.reserved[2]) * root.scale / monitor.scale) :
diff --git a/.config/quickshell/modules/overview/SearchItem.qml b/.config/quickshell/modules/overview/SearchItem.qml
index 00d5da743..d23cb4c09 100644
--- a/.config/quickshell/modules/overview/SearchItem.qml
+++ b/.config/quickshell/modules/overview/SearchItem.qml
@@ -80,7 +80,7 @@ RippleButton {
     buttonRadius: Appearance.rounding.normal
     colBackground: (root.down || root.keyboardDown) ? Appearance.colors.colLayer1Active : 
         ((root.hovered || root.focus) ? Appearance.colors.colLayer1Hover : 
-        ColorUtils.transparentize(Appearance.m3colors.m3surfaceContainerHigh, 1))
+        ColorUtils.transparentize(Appearance.colors.colSurfaceContainerHigh, 1))
     colBackgroundHover: Appearance.colors.colLayer1Hover
     colRipple: Appearance.colors.colLayer1Active
 
diff --git a/.config/quickshell/modules/overview/SearchWidget.qml b/.config/quickshell/modules/overview/SearchWidget.qml
index ea8dcb3b9..9e6866240 100644
--- a/.config/quickshell/modules/overview/SearchWidget.qml
+++ b/.config/quickshell/modules/overview/SearchWidget.qml
@@ -219,7 +219,7 @@ Item { // Wrapper
                     }
                     color: activeFocus ? Appearance.m3colors.m3onSurface : Appearance.m3colors.m3onSurfaceVariant
                     selectedTextColor: Appearance.m3colors.m3onSecondaryContainer
-                    selectionColor: Appearance.m3colors.m3secondaryContainer
+                    selectionColor: Appearance.colors.colSecondaryContainer
                     placeholderText: qsTr("Search, calculate or run")
                     placeholderTextColor: Appearance.m3colors.m3outline
                     implicitWidth: root.searchingText == "" ? Appearance.sizes.searchWidthCollapsed : Appearance.sizes.searchWidth
@@ -260,7 +260,7 @@ Item { // Wrapper
                 visible: root.showResults
                 Layout.fillWidth: true
                 height: 1
-                color: Appearance.m3colors.m3outlineVariant
+                color: Appearance.colors.colOutlineVariant
             }
 
             ListView { // App results
diff --git a/.config/quickshell/modules/session/SessionActionButton.qml b/.config/quickshell/modules/session/SessionActionButton.qml
index 207305769..becda60c1 100644
--- a/.config/quickshell/modules/session/SessionActionButton.qml
+++ b/.config/quickshell/modules/session/SessionActionButton.qml
@@ -18,7 +18,7 @@ RippleButton {
     buttonRadius: (button.focus || button.down) ? size / 2 : Appearance.rounding.verylarge
     colBackground: button.keyboardDown ? Appearance.colors.colSecondaryContainerActive : 
         button.focus ? Appearance.colors.colPrimary : 
-        Appearance.m3colors.m3secondaryContainer
+        Appearance.colors.colSecondaryContainer
     colBackgroundHover: Appearance.colors.colPrimary
     colRipple: Appearance.colors.colPrimaryActive
     property color colText: (button.down || button.keyboardDown || button.focus || button.hovered) ?
diff --git a/.config/quickshell/modules/sidebarLeft/AiChat.qml b/.config/quickshell/modules/sidebarLeft/AiChat.qml
index 9ba1d3688..1ce752c7b 100644
--- a/.config/quickshell/modules/sidebarLeft/AiChat.qml
+++ b/.config/quickshell/modules/sidebarLeft/AiChat.qml
@@ -345,7 +345,7 @@ Inline w/ backslash and round brackets \\(e^{i\\pi} + 1 = 0\\)
             implicitHeight: Math.max(inputFieldRowLayout.implicitHeight + inputFieldRowLayout.anchors.topMargin 
                 + commandButtonsRow.implicitHeight + commandButtonsRow.anchors.bottomMargin + columnSpacing, 45)
             clip: true
-            border.color: Appearance.m3colors.m3outlineVariant
+            border.color: Appearance.colors.colOutlineVariant
             border.width: 1
 
             Behavior on implicitHeight {
diff --git a/.config/quickshell/modules/sidebarLeft/Anime.qml b/.config/quickshell/modules/sidebarLeft/Anime.qml
index 444d3f052..1300d5482 100644
--- a/.config/quickshell/modules/sidebarLeft/Anime.qml
+++ b/.config/quickshell/modules/sidebarLeft/Anime.qml
@@ -359,7 +359,7 @@ Item {
             implicitHeight: Math.max(inputFieldRowLayout.implicitHeight + inputFieldRowLayout.anchors.topMargin 
                 + commandButtonsRow.implicitHeight + commandButtonsRow.anchors.bottomMargin + columnSpacing, 45)
             clip: true
-            border.color: Appearance.m3colors.m3outlineVariant
+            border.color: Appearance.colors.colOutlineVariant
             border.width: 1
 
             Behavior on implicitHeight {
diff --git a/.config/quickshell/modules/sidebarLeft/aiChat/AiMessage.qml b/.config/quickshell/modules/sidebarLeft/aiChat/AiMessage.qml
index 775d12082..8d7952110 100644
--- a/.config/quickshell/modules/sidebarLeft/aiChat/AiMessage.qml
+++ b/.config/quickshell/modules/sidebarLeft/aiChat/AiMessage.qml
@@ -91,7 +91,7 @@ Rectangle {
 
             Rectangle { // Name
                 id: nameWrapper
-                color: Appearance.m3colors.m3secondaryContainer
+                color: Appearance.colors.colSecondaryContainer
                 // color: "transparent"
                 radius: Appearance.rounding.small
                 implicitHeight: Math.max(nameRowLayout.implicitHeight + 5 * 2, 30)
diff --git a/.config/quickshell/modules/sidebarLeft/aiChat/AnnotationSourceButton.qml b/.config/quickshell/modules/sidebarLeft/aiChat/AnnotationSourceButton.qml
index f344308ca..a253a291e 100644
--- a/.config/quickshell/modules/sidebarLeft/aiChat/AnnotationSourceButton.qml
+++ b/.config/quickshell/modules/sidebarLeft/aiChat/AnnotationSourceButton.qml
@@ -21,7 +21,7 @@ RippleButton {
     leftPadding: (implicitHeight - faviconSize) / 2
     rightPadding: 10
     buttonRadius: Appearance.rounding.full
-    colBackground: Appearance.m3colors.m3surfaceContainerHighest
+    colBackground: Appearance.colors.colSurfaceContainerHighest
     colBackgroundHover: Appearance.colors.colSurfaceContainerHighestHover
     colRipple: Appearance.colors.colSurfaceContainerHighestActive
 
diff --git a/.config/quickshell/modules/sidebarLeft/aiChat/MessageCodeBlock.qml b/.config/quickshell/modules/sidebarLeft/aiChat/MessageCodeBlock.qml
index ef0c1b5e9..ea7bb0ee3 100644
--- a/.config/quickshell/modules/sidebarLeft/aiChat/MessageCodeBlock.qml
+++ b/.config/quickshell/modules/sidebarLeft/aiChat/MessageCodeBlock.qml
@@ -40,7 +40,7 @@ ColumnLayout {
         topRightRadius: codeBlockBackgroundRounding
         bottomLeftRadius: Appearance.rounding.unsharpen
         bottomRightRadius: Appearance.rounding.unsharpen
-        color: Appearance.m3colors.m3surfaceContainerHighest
+        color: Appearance.colors.colSurfaceContainerHighest
         implicitHeight: codeBlockTitleBarRowLayout.implicitHeight + codeBlockHeaderPadding * 2
 
         RowLayout { // Language and buttons
@@ -209,7 +209,7 @@ ColumnLayout {
                     font.hintingPreference: Font.PreferNoHinting // Prevent weird bold text
                     font.pixelSize: Appearance.font.pixelSize.small
                     selectedTextColor: Appearance.m3colors.m3onSecondaryContainer
-                    selectionColor: Appearance.m3colors.m3secondaryContainer
+                    selectionColor: Appearance.colors.colSecondaryContainer
                     // wrapMode: TextEdit.Wrap
                     color: messageData.thinking ? Appearance.colors.colSubtext : Appearance.colors.colOnLayer1
 
diff --git a/.config/quickshell/modules/sidebarLeft/aiChat/MessageTextBlock.qml b/.config/quickshell/modules/sidebarLeft/aiChat/MessageTextBlock.qml
index 25ecb05a6..faa6c5590 100644
--- a/.config/quickshell/modules/sidebarLeft/aiChat/MessageTextBlock.qml
+++ b/.config/quickshell/modules/sidebarLeft/aiChat/MessageTextBlock.qml
@@ -120,7 +120,7 @@ ColumnLayout {
         font.hintingPreference: Font.PreferNoHinting // Prevent weird bold text
         font.pixelSize: Appearance.font.pixelSize.small
         selectedTextColor: Appearance.m3colors.m3onSecondaryContainer
-        selectionColor: Appearance.m3colors.m3secondaryContainer
+        selectionColor: Appearance.colors.colSecondaryContainer
         wrapMode: TextEdit.Wrap
         color: messageData.thinking ? Appearance.colors.colSubtext : Appearance.colors.colOnLayer1
         textFormat: renderMarkdown ? TextEdit.MarkdownText : TextEdit.PlainText
diff --git a/.config/quickshell/modules/sidebarLeft/aiChat/MessageThinkBlock.qml b/.config/quickshell/modules/sidebarLeft/aiChat/MessageThinkBlock.qml
index 27dae3bd3..1ae941b78 100644
--- a/.config/quickshell/modules/sidebarLeft/aiChat/MessageThinkBlock.qml
+++ b/.config/quickshell/modules/sidebarLeft/aiChat/MessageThinkBlock.qml
@@ -64,7 +64,7 @@ Item {
 
         Rectangle { // Header background
             id: header
-            color: Appearance.m3colors.m3surfaceContainerHighest
+            color: Appearance.colors.colSurfaceContainerHighest
             Layout.fillWidth: true
             implicitHeight: thinkBlockTitleBarRowLayout.implicitHeight + thinkBlockHeaderPaddingVertical * 2
 
diff --git a/.config/quickshell/modules/sidebarLeft/anime/BooruImage.qml b/.config/quickshell/modules/sidebarLeft/anime/BooruImage.qml
index c8c89f72a..4e115bc76 100644
--- a/.config/quickshell/modules/sidebarLeft/anime/BooruImage.qml
+++ b/.config/quickshell/modules/sidebarLeft/anime/BooruImage.qml
@@ -133,7 +133,7 @@ Button {
                     opacity: root.showActions ? 1 : 0
                     visible: opacity > 0
                     radius: Appearance.rounding.small
-                    color: Appearance.m3colors.m3surfaceContainer
+                    color: Appearance.colors.colSurfaceContainer
                     implicitHeight: contextMenuColumnLayout.implicitHeight + radius * 2
                     implicitWidth: contextMenuColumnLayout.implicitWidth
 
diff --git a/.config/quickshell/modules/sidebarLeft/anime/BooruResponse.qml b/.config/quickshell/modules/sidebarLeft/anime/BooruResponse.qml
index c19c8bb98..7a207582f 100644
--- a/.config/quickshell/modules/sidebarLeft/anime/BooruResponse.qml
+++ b/.config/quickshell/modules/sidebarLeft/anime/BooruResponse.qml
@@ -67,7 +67,7 @@ Rectangle {
         RowLayout { // Header
             Rectangle { // Provider name
                 id: providerNameWrapper
-                color: Appearance.m3colors.m3secondaryContainer
+                color: Appearance.colors.colSecondaryContainer
                 radius: Appearance.rounding.small
                 implicitWidth: providerName.implicitWidth + 10 * 2
                 implicitHeight: Math.max(providerName.implicitHeight + 5 * 2, 30)
@@ -269,7 +269,7 @@ Rectangle {
             }
 
             buttonRadius: Appearance.rounding.small
-            colBackground: Appearance.m3colors.m3surfaceContainerHighest
+            colBackground: Appearance.colors.colSurfaceContainerHighest
             colBackgroundHover: Appearance.colors.colSurfaceContainerHighestHover
             colRipple: Appearance.colors.colSurfaceContainerHighestActive            
 
diff --git a/.config/quickshell/modules/sidebarLeft/translator/TextCanvas.qml b/.config/quickshell/modules/sidebarLeft/translator/TextCanvas.qml
index 7f32a63d9..dad25020f 100644
--- a/.config/quickshell/modules/sidebarLeft/translator/TextCanvas.qml
+++ b/.config/quickshell/modules/sidebarLeft/translator/TextCanvas.qml
@@ -21,9 +21,9 @@ Rectangle {
     default property alias actionButtons: actions.data
     Layout.fillWidth: true
     implicitHeight: Math.max(150, inputColumn.implicitHeight)
-    color: isInput ? Appearance.colors.colLayer1 : Appearance.m3colors.m3surfaceContainer
+    color: isInput ? Appearance.colors.colLayer1 : Appearance.colors.colSurfaceContainer
     radius: Appearance.rounding.normal
-    border.color: isInput ? Appearance.m3colors.m3outlineVariant : "transparent"
+    border.color: isInput ? Appearance.colors.colOutlineVariant : "transparent"
     border.width: isInput ? 1 : 0
 
     signal inputTextChanged(); // Signal emitted when text changes
diff --git a/.config/quickshell/modules/sidebarRight/calendar/CalendarDayButton.qml b/.config/quickshell/modules/sidebarRight/calendar/CalendarDayButton.qml
index 88de9202c..7d1af447d 100644
--- a/.config/quickshell/modules/sidebarRight/calendar/CalendarDayButton.qml
+++ b/.config/quickshell/modules/sidebarRight/calendar/CalendarDayButton.qml
@@ -26,7 +26,7 @@ RippleButton {
         font.weight: bold ? Font.DemiBold : Font.Normal
         color: (isToday == 1) ? Appearance.m3colors.m3onPrimary : 
             (isToday == 0) ? Appearance.colors.colOnLayer1 : 
-            Appearance.m3colors.m3outlineVariant
+            Appearance.colors.colOutlineVariant
 
         Behavior on color {
             animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
diff --git a/.config/quickshell/modules/sidebarRight/todo/TodoWidget.qml b/.config/quickshell/modules/sidebarRight/todo/TodoWidget.qml
index 527ed6978..9f5f4fd08 100644
--- a/.config/quickshell/modules/sidebarRight/todo/TodoWidget.qml
+++ b/.config/quickshell/modules/sidebarRight/todo/TodoWidget.qml
@@ -114,7 +114,7 @@ Item {
             id: tabBarBottomBorder
             Layout.fillWidth: true
             height: 1
-            color: Appearance.m3colors.m3outlineVariant
+            color: Appearance.colors.colOutlineVariant
         }
 
         SwipeView {
@@ -228,7 +228,7 @@ Item {
             anchors.margins: root.dialogMargins
             implicitHeight: dialogColumnLayout.implicitHeight
 
-            color: Appearance.m3colors.m3surfaceContainerHigh
+            color: Appearance.colors.colSurfaceContainerHigh
             radius: Appearance.rounding.normal
 
             function addTask() {
@@ -264,7 +264,7 @@ Item {
                     color: activeFocus ? Appearance.m3colors.m3onSurface : Appearance.m3colors.m3onSurfaceVariant
                     renderType: Text.NativeRendering
                     selectedTextColor: Appearance.m3colors.m3onSecondaryContainer
-                    selectionColor: Appearance.m3colors.m3secondaryContainer
+                    selectionColor: Appearance.colors.colSecondaryContainer
                     placeholderText: qsTr("Task description")
                     placeholderTextColor: Appearance.m3colors.m3outline
                     focus: root.showAddDialog
diff --git a/.config/quickshell/modules/sidebarRight/volumeMixer/VolumeMixer.qml b/.config/quickshell/modules/sidebarRight/volumeMixer/VolumeMixer.qml
index 1799df556..2e1570f30 100644
--- a/.config/quickshell/modules/sidebarRight/volumeMixer/VolumeMixer.qml
+++ b/.config/quickshell/modules/sidebarRight/volumeMixer/VolumeMixer.qml
@@ -161,7 +161,7 @@ Item {
 
         Rectangle { // The dialog
             id: dialog
-            color: Appearance.m3colors.m3surfaceContainerHigh
+            color: Appearance.colors.colSurfaceContainerHigh
             radius: Appearance.rounding.normal
             anchors.left: parent.left
             anchors.right: parent.right