feat(theme): get expressive ~ new bold color palette options

quickshell/Common/SettingsData.qml

@@ -168,6 +168,8 @@ Singleton {
     property bool matugenSmartMode: Spec.SPEC.matugenSmartMode.def
     property string matugenSourceMode: Spec.SPEC.matugenSourceMode.def
     property real matugenContrast: Spec.SPEC.matugenContrast.def
+    property string matugenSeedColor: Spec.SPEC.matugenSeedColor.def
+    property string matugenSpec: Spec.SPEC.matugenSpec.def
     property bool runUserMatugenTemplates: Spec.SPEC.runUserMatugenTemplates.def
     property string matugenTargetMonitor: Spec.SPEC.matugenTargetMonitor.def
     property real popupTransparency: Spec.SPEC.popupTransparency.def
@@ -2506,6 +2508,22 @@ Singleton {
         set("matugenContrast", value);
     }
 
+    function setMatugenSeedColor(hex) {
+        var normalized = /^#[0-9a-f]{6}$/i.test(hex || "") ? hex.toLowerCase() : "";
+        if (matugenSeedColor === normalized)
+            return;
+        set("matugenSeedColor", normalized);
+    }
+
+    function setMatugenSpec(spec) {
+        var normalized = spec === "2025" ? "2025" : "2021";
+        if (matugenSpec === normalized)
+            return;
+        if (normalized === "2025" && matugenContrast < 0)
+            set("matugenContrast", 0);
+        set("matugenSpec", normalized);
+    }
+
     function setMatugenTargetMonitor(monitorName) {
         if (matugenTargetMonitor === monitorName)
             return;

quickshell/Common/Theme.qml

@@ -1777,9 +1777,15 @@ Singleton {
         // binary is a supported setup (DMS_SHELL_DIR / -c), and an older binary
         // exits with "unknown flag: --source-mode" rather than ignoring it, so
         // the default must not put the flag on the command line at all.
-        if (typeof SettingsData !== "undefined" && SettingsData.matugenSourceMode && SettingsData.matugenSourceMode !== "dominant") {
+        const seedColor = (typeof SettingsData !== "undefined" && !stockColors) ? SettingsData.matugenSeedColor : "";
+        if (seedColor) {
+            args.push("--seed-color", seedColor);
+        } else if (typeof SettingsData !== "undefined" && SettingsData.matugenSourceMode && SettingsData.matugenSourceMode !== "dominant") {
             args.push("--source-mode", SettingsData.matugenSourceMode);
         }
+        if (typeof SettingsData !== "undefined" && !stockColors && SettingsData.matugenSpec === "2025") {
+            args.push("--spec", "2025");
+        }
 
         if (typeof SettingsData !== "undefined") {
             const skipTemplates = [];

quickshell/Common/settings/SettingsSpec.js

@@ -25,6 +25,14 @@ var LOCAL_SPEC = {
         def: 0,
         onChange: "regenSystemThemes"
     },
+    matugenSeedColor: {
+        def: "",
+        onChange: "regenSystemThemes"
+    },
+    matugenSpec: {
+        def: "2021",
+        onChange: "regenSystemThemes"
+    },
     runUserMatugenTemplates: {
         def: true,
         onChange: "regenSystemThemes"

quickshell/Modules/Settings/ThemeColorsTab.qml

@@ -18,9 +18,9 @@ Item {
     property var matugenSchemePreviews: ({})
     property string matugenPreviewRequestKey: ""
     property string matugenPreviewLoadedKey: ""
-    readonly property string matugenPreviewSource: Theme.getMatugenColor("source_color", Theme.primary).toString()
-    readonly property string matugenPreviewImage: (Theme.rawWallpaperPath && !Theme.rawWallpaperPath.startsWith("#")) ? Theme.rawWallpaperPath : ""
-    readonly property string matugenPreviewKey: matugenPreviewSource + "|" + (SettingsData.matugenContrast ?? 0) + "|" + matugenPreviewImage
+    readonly property string matugenPreviewSource: SettingsData.matugenSeedColor || Theme.getMatugenColor("source_color", Theme.primary).toString()
+    readonly property string matugenPreviewImage: (!SettingsData.matugenSeedColor && Theme.rawWallpaperPath && !Theme.rawWallpaperPath.startsWith("#")) ? Theme.rawWallpaperPath : ""
+    readonly property string matugenPreviewKey: matugenPreviewSource + "|" + (SettingsData.matugenContrast ?? 0) + "|" + matugenPreviewImage + "|" + SettingsData.matugenSpec
     property bool matugenGenerating: false
     readonly property var currentPalette: ThemePalette.pick({
         "primary": Theme.primary,
@@ -67,6 +67,8 @@ Item {
         const args = [Proc.dmsBin, "matugen", "preview", "--source-color", matugenPreviewSource, "--contrast", String(SettingsData.matugenContrast ?? 0)];
         if (matugenPreviewImage)
             args.push("--image", matugenPreviewImage);
+        if (SettingsData.matugenSpec === "2025")
+            args.push("--spec", "2025");
         Proc.runCommand("", args, (output, exitCode) => {
             if (requestKey !== themeColorsTab.matugenPreviewRequestKey)
                 return;
@@ -431,21 +433,29 @@ Item {
                         enabled: Theme.matugenAvailable
                         body: Item {
                             width: parent.width
-                            height: themeColorsTab.matugenPreviewsReady ? schemeGrid.implicitHeight : Theme.minimumTouchTargetSize
+                            // the grid keeps its height while previews regenerate so the page does not jump
+                            height: schemeGrid.implicitHeight
+
+                            SettingsSwatchGrid {
+                                id: schemeGrid
+                                options: themeColorsTab.matugenSchemeOptions
+                                currentValue: SettingsData.matugenScheme
+                                enabled: themeColorsTab.matugenPreviewsReady
+                                opacity: themeColorsTab.matugenPreviewsReady ? 1 : Theme.pendingOpacity
+                                onSelected: value => SettingsData.setMatugenScheme(value)
+
+                                Behavior on opacity {
+                                    NumberAnimation {
+                                        duration: Theme.shortDuration
+                                    }
+                                }
+                            }
 
                             DankSpinner {
                                 anchors.centerIn: parent
                                 running: !themeColorsTab.matugenPreviewsReady
                                 visible: running
                             }
-
-                            SettingsSwatchGrid {
-                                id: schemeGrid
-                                visible: themeColorsTab.matugenPreviewsReady
-                                options: themeColorsTab.matugenSchemeOptions
-                                currentValue: SettingsData.matugenScheme
-                                onSelected: value => SettingsData.setMatugenScheme(value)
-                            }
                         }
                     }
 
@@ -470,7 +480,7 @@ Item {
                         text: I18n.tr("Source color")
                         options: cachedSourceModes
                         currentValue: Theme.getSourceMode(SettingsData.matugenSourceMode).label
-                        enabled: Theme.matugenAvailable
+                        enabled: Theme.matugenAvailable && !SettingsData.matugenSeedColor
                         onValueChanged: value => {
                             for (var i = 0; i < Theme.availableSourceModes.length; i++) {
                                 var option = Theme.availableSourceModes[i];
@@ -482,7 +492,57 @@ Item {
                         }
                     }
 
+                    ColorDropdownRow {
+                        visible: Theme.currentTheme === Theme.dynamic && Theme.currentThemeCategory !== "registry"
+                        tab: "theme"
+                        tags: ["matugen", "seed", "pick", "eyedropper", "dynamic"]
+                        settingKey: "matugenSeedColor"
+                        text: I18n.tr("Derived color")
+                        enabled: Theme.matugenAvailable
+                        options: [
+                            {
+                                "value": "default",
+                                "previewColor": Theme.getMatugenColor("source_color", Theme.primary),
+                                "label": I18n.tr("From wallpaper", "matugen seed color option")
+                            },
+                            {
+                                "value": "custom",
+                                "label": I18n.tr("Custom")
+                            }
+                        ]
+                        currentMode: SettingsData.matugenSeedColor ? "custom" : "default"
+                        customColor: SettingsData.matugenSeedColor || Theme.getMatugenColor("source_color", Theme.primary)
+                        pickerTitle: I18n.tr("Seed color")
+                        onModeSelected: mode => {
+                            if (mode !== "custom") {
+                                SettingsData.setMatugenSeedColor("");
+                                return;
+                            }
+                            if (SettingsData.matugenSeedColor)
+                                return;
+                            SettingsData.setMatugenSeedColor(Theme.getMatugenColor("source_color", Theme.primary).toString());
+                        }
+                        onCustomColorSelected: selectedColor => SettingsData.setMatugenSeedColor(Theme.withAlpha(selectedColor, 1).toString())
+                    }
+
+                    SettingsButtonGroupRow {
+                        visible: Theme.currentTheme === Theme.dynamic && Theme.currentThemeCategory !== "registry"
+                        tab: "theme"
+                        tags: ["matugen", "spec", "expressive", "vivid", "saturated", "bold", "dynamic"]
+                        settingKey: "matugenSpec"
+                        text: I18n.tr("Material palette")
+                        enabled: Theme.matugenAvailable
+                        model: [I18n.tr("Standard", "adjective, panel motion option and bar layout mode option"), I18n.tr("Expressive", "matugen color scheme option")]
+                        currentIndex: SettingsData.matugenSpec === "2025" ? 1 : 0
+                        onSelectionChanged: (index, selected) => {
+                            if (!selected)
+                                return;
+                            SettingsData.setMatugenSpec(index === 1 ? "2025" : "2021");
+                        }
+                    }
+
                     SettingsSliderRow {
+                        id: contrastRow
                         visible: Theme.currentTheme === Theme.dynamic && Theme.currentThemeCategory !== "registry"
                         tab: "theme"
                         tags: ["matugen", "contrast", "dynamic"]
@@ -492,7 +552,12 @@ Item {
                         minimum: -100
                         maximum: 100
                         enabled: Theme.matugenAvailable
-                        onSliderDragFinished: finalValue => SettingsData.setMatugenContrast(finalValue / 100)
+                        onSliderDragFinished: finalValue => {
+                            const clamped = SettingsData.matugenSpec === "2025" ? Math.max(0, finalValue) : finalValue;
+                            SettingsData.setMatugenContrast(clamped / 100);
+                            if (clamped !== finalValue)
+                                contrastRow.resync();
+                        }
                     }
 
                     Column {

quickshell/Modules/Settings/Widgets/SettingsSliderRow.qml

@@ -33,9 +33,13 @@ SettingsRow {
         sliderDragFinished(next);
     }
 
+    function resync() {
+        slider.value = Math.round(value);
+    }
+
     title: text
     subtitle: description
-    onValueChanged: slider.value = Math.round(value)
+    onValueChanged: resync()
 
     StyledText {
         text: root.minimumLabel

quickshell/translations/settings_search_index.json

@@ -5051,6 +5051,73 @@
     ],
     "parentLabel": "Wallpaper & colors"
   },
+  {
+    "section": "matugenSeedColor",
+    "label": "Derived color",
+    "tabIndex": 10,
+    "category": "Theme & colors",
+    "keywords": [
+      "appearance",
+      "background",
+      "bg",
+      "color",
+      "colors",
+      "colour",
+      "colours",
+      "derived",
+      "desktop",
+      "dynamic",
+      "eyedropper",
+      "hue",
+      "image",
+      "look",
+      "matugen",
+      "palette",
+      "pick",
+      "picture",
+      "scheme",
+      "seed",
+      "style",
+      "theme",
+      "tint",
+      "wallpaper"
+    ],
+    "parentLabel": "Wallpaper & colors"
+  },
+  {
+    "section": "matugenSpec",
+    "label": "Material palette",
+    "tabIndex": 10,
+    "category": "Theme & colors",
+    "keywords": [
+      "appearance",
+      "background",
+      "bg",
+      "bold",
+      "colors",
+      "colour",
+      "colours",
+      "desktop",
+      "dynamic",
+      "expressive",
+      "hue",
+      "image",
+      "look",
+      "material",
+      "matugen",
+      "palette",
+      "picture",
+      "saturated",
+      "scheme",
+      "spec",
+      "style",
+      "theme",
+      "tint",
+      "vivid",
+      "wallpaper"
+    ],
+    "parentLabel": "Wallpaper & colors"
+  },
   {
     "section": "matugenScheme",
     "label": "Matugen palette",