Quickshell Shell

The "shell" components like the top bar, side bar, control center, and notifications are written in Quickshell, which allows you to describe Wayland desktop components using QML. My setup is based on illogical-impulse (end-4's dots, directory alias ii), with modifications on top of it.

Let me be clear upfront: this involves 70,000 lines of QML and over 900 files, most of which I did not write. Therefore, what's truly useful for me (and for readers of this guide) is not a file-by-file walkthrough, but rather two key concepts: how the layering works and where the colors come from. Once you understand these two points, you can easily locate and modify any component you need.

First, let's look at what Quickshell itself provides: it connects QML (Qt's declarative UI language) to Wayland's layer-shell, enabling you to describe desktop-layer components such as top bars, floating windows, and lock screens using a declarative approach based on "property binding + signals." The advantage is reactivity—when a value changes, the UI bound to it automatically redraws, eliminating the need to manually write refresh logic.

Built on top of this, the structure of ii consists of two layers: services fetch data, and modules render the interface:

• Services encapsulate system states into QML singleton objects: PipeWire (volume/devices), NetworkManager (network), UPower (battery), MPRIS (currently playing media), etc., each exposing bindable properties.
• Modules declaratively render these states into panels and controls; interactions (clicks, drags, etc.) then callback to the respective service.

// Roughly: a small slider that follows system volume
Slider {
    value: Pipewire.defaultSink.volume       // Bind to service property
    onMoved: Pipewire.defaultSink.volume = value  // Write back on interaction
}

So, if you want to add a widget to the top bar, the pattern is fixed: write some QML in the modules, fetch data from the corresponding service, and bind it—without touching the majority of those 900 files. To modify an existing component, simply trace back to "which service it reads from."

The shell does not define its own colors; instead, it reads ~/.local/state/quickshell/user/generated/colors.json, generated by matugen. Thus, when you change your wallpaper, the entire shell, along with Ghostty and the lock screen, changes color accordingly (matugen post).

It is launched at boot by Hyprland and runs persistently. Because it is a large component tied to the upstream rice, I did not include it in chezmoi—instead, I follow upstream updates and make a few local modifications, which is much less burdensome than maintaining 70,000 lines myself.