fix: unify provider notification logos

Author: bernardopg

AiOverviewControlSettings.qml

@@ -3,6 +3,7 @@ import QtQuick.Layouts
 import Quickshell
 import Quickshell.Io
 import qs.Common
+import qs.Services
 import qs.Widgets
 import qs.Modules.Plugins
 
@@ -14,6 +15,7 @@ PluginSettings {
     property var selectedIds: normalizeProviderSelection(loadValue("providerSelection", "codex,claude,copilot"))
     property var pinnedIds: normalizeCsvList(loadValue("pinnedProviders", ""))
     property var pillIds: normalizePillSelection(loadValue("pillProviders", selectedIds.join(",")))
+    property color providerLogoColor: loadValue("providerLogoColor", Theme.primary.toString())
 
     function normalizeCsvList(value) {
         const parts = String(value || "").split(",");
@@ -48,6 +50,18 @@ PluginSettings {
 
     function isPinned(id) { return pinnedIds.indexOf(id) >= 0; }
 
+    function openProviderLogoColorPicker() {
+        const modal = PopoutService.colorPickerModal;
+        if (!modal) return;
+        modal.selectedColor = loadValue("providerLogoColor", Theme.primary.toString());
+        modal.pickerTitle = t("settings.logo_color", "Provider logo color");
+        modal.onColorSelectedCallback = function(selectedColor) {
+            root.providerLogoColor = selectedColor;
+            saveValue("providerLogoColor", selectedColor.toString());
+        };
+        modal.show();
+    }
+
     function togglePinned(id) {
         const result = pinnedIds.slice();
         const index = result.indexOf(id);
@@ -469,7 +483,7 @@ PluginSettings {
                                 providerId: pillProviderChip.modelData.id
                                 fallbackIcon: pillProviderChip.modelData.icon
                                 logoSize: 16
-                                tintColor: pillProviderChip.active ? Theme.primary : Theme.surfaceVariantText
+                                tintColor: root.providerLogoColor
                                 anchors.verticalCenter: parent.verticalCenter
                             }
 
@@ -522,6 +536,72 @@ PluginSettings {
         onToggled: function(checked) { saveValue("showErrorProviders", checked ? "true" : "false"); }
     }
 
+    Column {
+        width: parent.width
+        spacing: Theme.spacingXS
+
+        StyledText {
+            width: parent.width
+            text: t("settings.logo_color", "Provider logo color")
+            color: Theme.surfaceText
+            font.pixelSize: Theme.fontSizeSmall
+            font.weight: Font.Medium
+        }
+
+        StyledText {
+            width: parent.width
+            text: t("settings.logo_color_desc", "One monochrome color for every provider logo in the dashboard and desktop notifications.")
+            color: Theme.surfaceVariantText
+            font.pixelSize: Theme.fontSizeSmall - 1
+            wrapMode: Text.WordWrap
+        }
+
+        Rectangle {
+            width: parent.width
+            height: 46
+            radius: Theme.cornerRadius
+            color: Theme.surfaceContainerHigh
+
+            Row {
+                anchors.fill: parent
+                anchors.leftMargin: Theme.spacingM
+                anchors.rightMargin: Theme.spacingM
+                spacing: Theme.spacingM
+
+                Rectangle {
+                    width: 28
+                    height: 28
+                    radius: width / 2
+                    color: root.providerLogoColor
+                    border.color: Theme.outline
+                    border.width: 1
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+
+                StyledText {
+                    text: root.providerLogoColor.toString()
+                    color: Theme.surfaceText
+                    font.pixelSize: Theme.fontSizeSmall
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+
+                Item { width: 1; height: 1; Layout.fillWidth: true }
+
+                DankIcon {
+                    name: "edit"
+                    size: Theme.iconSizeSmall
+                    color: Theme.surfaceVariantText
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+            }
+
+            StateLayer {
+                stateColor: Theme.surfaceText
+                onClicked: root.openProviderLogoColorPicker()
+            }
+        }
+    }
+
     DankToggle {
         width: parent.width
         text: t("settings.show_projects", "Show Claude projects")
@@ -880,7 +960,7 @@ PluginSettings {
                             providerId: providerChip.modelData.id
                             fallbackIcon: providerChip.modelData.icon
                             logoSize: 16
-                            tintColor: providerChip.active ? Theme.primary : Theme.surfaceVariantText
+                            tintColor: root.providerLogoColor
                             anchors.verticalCenter: parent.verticalCenter
                         }
                         StyledText { text:modelData.name; color:providerChip.active ? Theme.primary : Theme.surfaceVariantText; font.pixelSize:Theme.fontSizeSmall; font.weight:providerChip.active ? Font.Medium : Font.Normal }
@@ -930,7 +1010,7 @@ PluginSettings {
                                 providerId: providerDetailRow.modelData.id
                                 fallbackIcon: providerDetailRow.modelData.icon
                                 logoSize: 16
-                                tintColor: Theme.primary
+                                tintColor: root.providerLogoColor
                             }
                         }
 

AiOverviewControlWidget.qml

@@ -40,6 +40,10 @@ PluginComponent {
     // In-process dispatch bookkeeping. The helper owns the durable state so
     // this remains only a cheap guard between refreshes in this instance.
     property var notifiedMap: ({})
+    property color providerLogoColor: {
+        const saved = String(pluginData.providerLogoColor || "").trim();
+        return saved.length > 0 ? saved : Theme.primary;
+    }
     property bool notifyEnabled: String(pluginData.quotaNotifications ?? "true") === "true"
     property int notifyThreshold: {
         const parsed = parseInt(pluginData.notifyThreshold || "85");
@@ -1230,6 +1234,7 @@ PluginComponent {
                 String(notifyCooldownSecs),
                 exhausted ? "critical" : "normal",
                 notificationIconPath(provider.provider),
+                providerLogoColor.toString(),
                 title,
                 bodyParts.join(" · ")
             ]);
@@ -1278,6 +1283,9 @@ PluginComponent {
             const lastSlash = withoutScheme.lastIndexOf("/");
             _pluginDir = lastSlash !== -1 ? withoutScheme.substring(0, lastSlash) : withoutScheme;
         }
+        // One-time, idempotent cleanup of the legacy state whose full reset
+        // timestamp made jitter look like a new quota window every refresh.
+        Quickshell.execDetached(["bash", notifyAlertScript, "--migrate"]);
         detectBinary();
     }
 
@@ -2195,7 +2203,7 @@ PluginComponent {
                             providerId: pillEntry.modelData.provider
                             fallbackIcon: root.iconForProvider(pillEntry.modelData.provider)
                             logoSize: 14
-                            tintColor: root.providerAccent(pillEntry.modelData.provider)
+                            tintColor: root.providerLogoColor
                             anchors.verticalCenter: parent.verticalCenter
                         }
 
@@ -2261,7 +2269,7 @@ PluginComponent {
                         providerId: modelData.provider
                         fallbackIcon: root.iconForProvider(modelData.provider)
                         logoSize: 13
-                        tintColor: root.providerAccent(modelData.provider)
+                        tintColor: root.providerLogoColor
                         anchors.horizontalCenter: parent.horizontalCenter
                     }
 
@@ -2631,16 +2639,21 @@ PluginComponent {
                         anchors.fill: parent
                         anchors.margins: 4
                         radius: width / 2
-                        color: Theme.withAlpha(card.accentColor, 0.14)
-                        border.width: card.hasUsage ? 0 : 1
-                        border.color: Theme.withAlpha(card.accentColor, 0.4)
+                        // Logo surfaces intentionally use the single
+                        // user-selected provider-logo colour. Usage state
+                        // remains on the surrounding progress ring instead
+                        // of making each provider mark look like a different
+                        // brand-coloured icon.
+                        color: Theme.withAlpha(root.providerLogoColor, 0.14)
+                        border.width: 1
+                        border.color: Theme.withAlpha(root.providerLogoColor, 0.32)
 
                         ProviderLogo {
                             anchors.centerIn: parent
                             providerId: card.provider.provider
                             fallbackIcon: root.iconForProvider(card.provider.provider)
                             logoSize: card.dense ? 15 : (card.compact ? 17 : 20)
-                            tintColor: card.accentColor
+                            tintColor: root.providerLogoColor
                         }
                     }
                 }

CHANGELOG.md

@@ -6,9 +6,14 @@
 
 - Reworked quota-alert deduplication around a stable provider/window identity. Timestamp jitter, locale changes, and threshold edits no longer re-arm alerts or flood the DankMaterialShell notification popup.
 - High-usage alerts now escalate in place to a critical “quota reached” notification at 100%; reminders reuse the same DMS notification instead of stacking cards, and a critical alert is never downgraded back to a warning.
-- Notification popups now use each provider's bundled brand logo and concise localized text for the quota window, usage percentage, and reset time.
+- Notification popups now use a padded monochrome rendering of each provider's bundled logo and concise localized text for the quota window, usage percentage, and reset time.
 - Clarified the notification settings, re-alert behavior, and documentation in every supported locale.
 
+### Provider logo presentation
+
+- All provider marks in the DankBar pill, dashboard, settings, and new desktop alerts now use one configurable monochrome color while preserving the vector silhouette and transparent canvas.
+- Provider-card logo surfaces now share that same color instead of individual brand accents, and Copilot uses the GitHub Copilot mark.
+
 ## 1.7.0 - 2026-07-13
 
 ### DankBar and provider identity

ProviderLogo.qml

@@ -27,13 +27,6 @@ Item {
         const normalized = String(providerId || "").trim().toLowerCase();
         return aliases[normalized] || normalized;
     }
-    readonly property var colorLogoIds: [
-        "9router", "ai21", "amp", "antigravity", "byteplus", "claude",
-        "cloudflare", "cohere", "copilot", "deepseek", "fireworks",
-        "gemini", "glm", "kimi", "kiro", "minimax", "mistral",
-        "nvidia", "perplexity", "qwen", "together", "vertexai", "warp"
-    ]
-    readonly property bool usesBrandColors: colorLogoIds.indexOf(canonicalId) >= 0
     readonly property string logoExtension: canonicalId === "byteplus" ? ".png" : ".svg"
     readonly property url logoSource: canonicalId.length > 0
         ? Qt.resolvedUrl("assets/provider-logos/" + canonicalId + logoExtension)
@@ -57,15 +50,16 @@ Item {
         mipmap: true
         asynchronous: true
         cache: true
-        visible: root.usesBrandColors && root.logoReady
-    }
 
-    MultiEffect {
-        anchors.fill: logoImage
-        source: logoImage
-        visible: !root.usesBrandColors && root.logoReady
-        colorization: 1.0
-        colorizationColor: root.tintColor
+        // Applying the colorization to the image layer keeps the original
+        // transparent SVG silhouette; do not use it as a sibling effect
+        // source, which is opaque with this renderer.
+        layer.enabled: true
+        layer.effect: MultiEffect {
+            brightness: 1.0
+            colorization: 1.0
+            colorizationColor: root.tintColor
+        }
     }
 
     DankIcon {

assets/provider-logos/SOURCES.md

@@ -8,5 +8,6 @@ All marks are stored locally so the plugin never depends on a network request at
 - 9Router: [official `public/favicon.svg`](https://github.com/decolua/9router/blob/master/public/favicon.svg), MIT.
 - BytePlus Ark: [official BytePlus favicon](https://sf-bpcms.bytepluscdn.com/obj/byteplus-public-aiso/portal/assets/favicon.png), discovered from the ModelArk product page.
 - Warp: [Simple Icons `warp`](https://simpleicons.org/?q=warp), CC0-1.0, brand color `#01A4FF`.
+- GitHub Copilot: [Simple Icons `githubcopilot`](https://simpleicons.org/?q=githubcopilot), CC0-1.0.
 
 The included license files cover the MIT-licensed Lobe Icons and 9Router assets. Product names and logos remain trademarks of their respective owners.

assets/provider-logos/copilot.svg

@@ -89,6 +89,8 @@
   "settings.informational_providers_desc": "Diese Anbieter bieten keine öffentliche, schreibgeschützte Kontingent-API. Ihre Karten verweisen auf die offizielle Nutzungsoberfläche.",
   "settings.language.description": "Sprache der Plugin-Oberfläche. Auto folgt der Systemsprache.",
   "settings.language.label": "Sprache",
+  "settings.logo_color": "Farbe der Anbieterlogos",
+  "settings.logo_color_desc": "Eine monochrome Farbe für alle Anbieterlogos im Dashboard und in Desktop-Benachrichtigungen.",
   "settings.notify.description": "Warnt einmal, wenn ein Anbieter den Schwellwert überschreitet, und aktualisiert dieselbe Benachrichtigung bei ausgeschöpftem Kontingent.",
   "settings.notify.label": "Kontingent-Benachrichtigungen",
   "settings.notify.overrides": "Schwellwerte pro Anbieter",

i18n/de_DE.json

@@ -89,6 +89,8 @@
   "settings.informational_providers_desc": "These providers expose no public read-only quota API. Their cards point to the official usage surface.",
   "settings.language.description": "UI language for this plugin. Auto follows system locale.",
   "settings.language.label": "Language",
+  "settings.logo_color": "Provider logo color",
+  "settings.logo_color_desc": "One monochrome color for every provider logo in the dashboard and desktop notifications.",
   "settings.notify.description": "Alert once when a provider crosses the threshold, then update the same notification if its quota is exhausted.",
   "settings.notify.label": "Quota notifications",
   "settings.notify.overrides": "Per-provider threshold overrides",