1waybar-states(5)              File Formats Manual             waybar-states(5)
2
3
4

NAME

6       waybar - states property
7

OVERVIEW

9       Some modules support 'states' which allows percentage values to be used
10       as styling triggers to apply a class when the value matches the de‐
11       clared state value.
12

STATES

14       Every entry (state) consists of a <name> (typeof: string) and a <value>
15       (typeof: integer).
16
17       •   The state can be addressed as a CSS class in the style.css. The
18           name of the CSS class is the <name> of the state. Each class gets
19           activated when the current value is equal to or less than the con‐
20           figured <value> for the battery module, or equal to or greater than
21           the configured <value> for all other modules.
22
23
24       •   Also, each state can have its own format. Those can be configured
25           via format-<name>, or if you want to differentiate a bit more, as
26           format-<status>-<state>.
27
28

EXAMPLE

30           "battery": {
31                "bat": "BAT2",
32                "interval": 60,
33                "states": {
34                     "warning": 30,
35                     "critical": 15
36                },
37                "format": "{capacity}% {icon}",
38                "format-icons": ["", "", "", "", ""],
39                "max-length": 25
40           }
41

STYLING STATES

43       •   #battery.<state> - <state> can be defined in the config.
44
45

EXAMPLE:

47       •   #battery.warning: { background: orange; }
48       •   #battery.critical: { background: red; }
49
50
51
52                                  2023-08-16                  waybar-states(5)