nixos/home/hyprland/waybar/style.css

@define-color base   #24273a;
@define-color mantle #1e2030;
@define-color crust  #181926;

@define-color text     #cad3f5;
@define-color subtext0 #a5adcb;
@define-color subtext1 #b8c0e0;

@define-color surface0 #363a4f;
@define-color surface1 #494d64;
@define-color surface2 #5b6078;

@define-color overlay0 #6e738d;
@define-color overlay1 #8087a2;
@define-color overlay2 #939ab7;

@define-color blue      #8aadf4;
@define-color lavender  #b7bdf8;
@define-color sapphire  #7dc4e4;
@define-color sky       #91d7e3;
@define-color teal      #8bd5ca;
@define-color green     #a6da95;
@define-color yellow    #eed49f;
@define-color peach     #f5a97f;
@define-color maroon    #ee99a0;
@define-color red       #ed8796;
@define-color mauve     #c6a0f6;
@define-color pink      #f5bde6;
@define-color flamingo  #f0c6c6;
@define-color rosewater #f4dbd6;

* {
    border: none;
    border-radius: 0px;
    margin: 0px;
    background: transparent;
    color: @text;
    font-family: "FiraCode Nerd Font";
    font-size: 18px;
}

window > box {
    margin-left: 10px;
    margin-right: 10px;
    border-left: 1px solid @surface2;
    border-right: 1px solid @surface2;
    border-bottom: 1px solid @surface2;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background: @base;
}

tooltip {
    background: @base;
    border: 1px solid @lavender;
    border-radius: 10px;
}

#workspaces,
#cava,
#cpu,
#memory,
#temperature,
#clock,
#pulseaudio,
#bluetooth,
#network,
#backlight,
#battery,
#tray {
    margin: 0px;
    padding-left: 10px;
    padding-right: 10px;
}

#workspaces button {
    border-top: 1px solid transparent;
    border-radius: 0px;
}

#workspaces button.active { border-top: 1px solid @lavender; }

#workspaces button.urgent { border-top: 1px solid @red; }