Configuring Waybar

Waybar is a highly customizable Wayland bar for Sway and other wlroots-based compositors. This skill navigates the complete Waybar documentation to answer configuration questions.

Config location: ~/.config/waybar/config.jsonc (JSON with comments) and ~/.config/waybar/style.css

Commands: waybar (start) | killall waybar && waybar & (restart) | waybar --help

How to Use This Skill

1. •Identify user intent from the topic index below
2. •Read the relevant doc file(s) from the docs/ subdirectory (paths are relative to this skill's directory)
3. •Answer using the documentation content

Always read docs before answering - don't rely on general knowledge about Waybar.

Topic Index

Core Documentation

System Monitoring Modules

Audio/Media Modules

Input/Display Modules

Connectivity Modules

Workspace/Compositor Modules

Utility Modules

Development

Keyword Quick Reference

Common search terms -> doc file:

• •volume, audio, sound -> Module:-PulseAudio.md or Module:-WirePlumber.md
• •wifi, ethernet, internet -> Module:-Network.md
• •time, date, clock format -> Module:-Clock.md
• •colors, font, styling -> Styling.md
• •icons, fonts, nerd fonts -> Styling.md + FAQ.md
• •click actions, on-click -> Individual module docs (most support it)
• •tooltip, hover -> Individual module docs
• •format, format-icons -> Individual module docs
• •workspaces, tags -> Compositor-specific module docs
• •custom script, exec -> Module:-Custom.md
• •slider, scroll -> Module:-PulseAudio-Slider.md, Module:-Backlight-Slider.md
• •multiple bars, multi-monitor -> Configuration.md
• •hide, autohide -> Configuration.md
• •layers, exclusive zone -> Configuration.md

Config Structure Overview

// ~/.config/waybar/config.jsonc
{
    "layer": "top",          // top or bottom layer
    "position": "top",       // top, bottom, left, right
    "height": 30,            // bar height in pixels
    "modules-left": ["sway/workspaces", "sway/mode"],
    "modules-center": ["clock"],
    "modules-right": ["network", "battery", "tray"],

    // Module-specific configuration
    "clock": {
        "format": "{:%H:%M}",
        "tooltip-format": "{:%Y-%m-%d}"
    }
}

Style Structure Overview

/* ~/.config/waybar/style.css */
* {
    font-family: "JetBrains Mono", monospace;
    font-size: 14px;
}

window#waybar {
    background: rgba(0, 0, 0, 0.8);
    color: white;
}

#clock, #battery, #network {
    padding: 0 10px;
}