Use the Blob icon for the bar menu button

branding/blob_icon.svg

@@ -0,0 +1,25 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="520.000000pt" height="511.000000pt" viewBox="0 0 520.000000 511.000000"
+ preserveAspectRatio="xMidYMid meet">
+<g transform="translate(0.000000,511.000000) scale(0.050000,-0.050000)"
+fill="#000000" stroke="none">
+<path d="M4790 10147 c-3157 -250 -5335 -3216 -4578 -6237 784 -3132 4321
+-4735 7258 -3290 2905 1429 3734 5102 1723 7628 -1028 1292 -2741 2030 -4403
+1899z m1090 -337 c3940 -604 5501 -5305 2677 -8061 -2334 -2278 -6268 -1614
+-7707 1301 -1482 3002 510 6440 3940 6798 173 18 888 -7 1090 -38z"/>
+<path d="M2810 8049 c-22 -5 -89 -19 -150 -31 -998 -194 -1377 -1466 -652
+-2188 1078 -1073 2875 139 2209 1490 -238 483 -926 840 -1407 729z m550 -269
+c782 -263 1032 -1216 470 -1788 -633 -642 -1757 -350 -1959 510 -195 826 658
+1558 1489 1278z"/>
+<path d="M2626 7544 c-486 -174 -571 -762 -147 -1018 572 -345 1209 298 812
+819 -142 185 -447 277 -665 199z"/>
+<path d="M6930 8029 c-1037 -228 -1420 -1465 -682 -2199 855 -850 2351 -270
+2351 910 0 832 -830 1473 -1669 1289z m689 -256 c777 -270 1012 -1233 437
+-1796 -638 -624 -1745 -325 -1945 525 -197 836 666 1564 1508 1271z"/>
+<path d="M7295 7073 c-373 -105 -571 -506 -415 -839 286 -608 1249 -418 1249
+246 0 411 -420 710 -834 593z"/>
+</g>
+</svg>

omarchy/README.md

@@ -78,14 +78,21 @@ by hand; see below for why.
 hardcodes workspaces 1-5 as always visible and has no setting for it, so the
 clone changes that list to 1-9 to match the old waybar `persistent-workspaces`.
 
-`plugins/blob.menu/` clones `omarchy.menu` to widen it and to let a menu row
-choose where it sits. `cardWidth` in `Menu.qml` is hardcoded at
+`plugins/blob.menu/` clones `omarchy.menu` to widen it, to let a menu row
+choose where it sits, and to put the Blob icon on the bar button. `cardWidth` in `Menu.qml` is hardcoded at
 `Style.space(300)`; the clone raises it to 440, so the apps menu (Super + Space)
 and the root menu (Super + Alt + Space) are both wider. The two oversized menus
 (screen recording, font picker) keep their own 520 and are untouched.
 `omarchy-menu` still targets `omarchy.menu` on the CLI - the manifest records
 `clonedFrom`, and the shell routes those calls here.
 
+`BarWidget.qml` swaps the stock `\ue900` glyph from the `omarchy` icon font for
+`branding/blob_icon.svg`. Qt renders SVG through `qt6-svg`, but an `Image`
+cannot be recolored, so the icon is used as an alpha mask over a rectangle
+filled with the bar foreground. That keeps it following the theme and the bar's
+own color animation the way a glyph did, and it means the black fill in the
+source file never matters.
+
 `mergeMenuSources` in `MenuModel.js` reads the default menu first and the user
 extension second, so a row that only exists in `extensions/omarchy-menu.jsonc`
 lands at the bottom of its menu with no way to move it. The clone adds a

omarchy/plugins/blob.menu/BarWidget.qml

@@ -1,10 +1,16 @@
 import QtQuick
+import QtQuick.Effects
+import Quickshell
+import qs.Commons
 import qs.Ui
 
 BarWidget {
   id: root
   moduleName: "omarchy.menu"
 
+  readonly property string iconPath: "file://" + Quickshell.env("HOME") + "/.config/omarchy/branding/blob_icon.svg"
+  readonly property int iconSize: Math.round(Style.font.body * 1.35)
+
   implicitWidth: button.implicitWidth
   implicitHeight: button.implicitHeight
 
@@ -12,13 +18,41 @@ BarWidget {
     id: button
     anchors.fill: parent
     bar: root.bar
-    text: "\ue900"
-    fontFamily: "omarchy"
+    labelVisible: false
+    hasVisualContent: true
+    fixedWidth: root.iconSize + Style.spaceReal(15)
     horizontalMargin: 7.5
     onPressed: function(button) {
       if (!root.bar) return
       if (button === Qt.RightButton) root.bar.run("xdg-terminal-exec")
       else root.bar.run("omarchy-shell shell toggle omarchy.menu '{\"menu\":\"root\"}'")
     }
+
+    Image {
+      id: iconMask
+      source: root.iconPath
+      visible: false
+      smooth: true
+      sourceSize.width: root.iconSize * 2
+      sourceSize.height: root.iconSize * 2
+    }
+
+    Rectangle {
+      anchors.centerIn: parent
+      width: root.iconSize
+      height: root.iconSize
+      color: button.foreground
+      visible: iconMask.status === Image.Ready
+      layer.enabled: true
+      layer.effect: MultiEffect {
+        maskEnabled: true
+        maskSource: iconMask
+      }
+
+      Behavior on color {
+        enabled: !root.bar || root.bar.foregroundAnimationEnabled
+        ColorAnimation { duration: 160 }
+      }
+    }
   }
 }