← All ports
Desktop
waybar
Colors only: waybar's look lives in your own style.css, so this is a palette of @define-color names (every role, plus paper, edge, hover and selection) to use in it. The example marks the focused workspace in gold and urgent ones in orange.
Showing WalnutTunnelEnamelMoquetteDeep LevelPortlandGuimardCatacombesCarrelage. Switch flavors with the bullets up top.
waybar Report a problem with this portReport a problem with this portReport a problem with this portReport a problem with this portReport a problem with this portReport a problem with this portReport a problem with this portReport a problem with this portReport a problem with this port
The quick way
The installer sets it up for you, then tells you the one thing it can't do. More ways to install
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor walnut --only waybar
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor tunnel --only waybar
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor enamel --only waybar
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor moquette --only waybar
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor deep --only waybar
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor portland --only waybar
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor guimard --only waybar
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor catacombes --only waybar
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor carrelage --only waybar
Turn it on
In ~/.config/waybar/style.css, at the top
@import "subway-seat.css";
window#waybar { background: @mantle; color: @text; border-bottom: 1px solid @crust; }
#workspaces button { color: @subtext0; }
#workspaces button:hover { background: @hover; }
#workspaces button.active, #workspaces button.focused { color: @text_hi; box-shadow: inset 0 -2px @yellow; }
#workspaces button.urgent { color: @orange; }
#battery.warning { color: @yellow; }
#battery.critical { color: @orange; }In ~/.config/waybar/style.css, at the top
@import "subway-seat-tunnel.css";
window#waybar { background: @mantle; color: @text; border-bottom: 1px solid @crust; }
#workspaces button { color: @subtext0; }
#workspaces button:hover { background: @hover; }
#workspaces button.active, #workspaces button.focused { color: @text_hi; box-shadow: inset 0 -2px @yellow; }
#workspaces button.urgent { color: @orange; }
#battery.warning { color: @yellow; }
#battery.critical { color: @orange; }In ~/.config/waybar/style.css, at the top
@import "subway-seat-enamel.css";
window#waybar { background: @mantle; color: @text; border-bottom: 1px solid @crust; }
#workspaces button { color: @subtext0; }
#workspaces button:hover { background: @hover; }
#workspaces button.active, #workspaces button.focused { color: @text_hi; box-shadow: inset 0 -2px @yellow; }
#workspaces button.urgent { color: @orange; }
#battery.warning { color: @yellow; }
#battery.critical { color: @orange; }In ~/.config/waybar/style.css, at the top
@import "london-moquette.css";
window#waybar { background: @mantle; color: @text; border-bottom: 1px solid @crust; }
#workspaces button { color: @subtext0; }
#workspaces button:hover { background: @hover; }
#workspaces button.active, #workspaces button.focused { color: @text_hi; box-shadow: inset 0 -2px @yellow; }
#workspaces button.urgent { color: @orange; }
#battery.warning { color: @yellow; }
#battery.critical { color: @orange; }In ~/.config/waybar/style.css, at the top
@import "london-deep-level.css";
window#waybar { background: @mantle; color: @text; border-bottom: 1px solid @crust; }
#workspaces button { color: @subtext0; }
#workspaces button:hover { background: @hover; }
#workspaces button.active, #workspaces button.focused { color: @text_hi; box-shadow: inset 0 -2px @yellow; }
#workspaces button.urgent { color: @orange; }
#battery.warning { color: @yellow; }
#battery.critical { color: @orange; }In ~/.config/waybar/style.css, at the top
@import "london-portland.css";
window#waybar { background: @mantle; color: @text; border-bottom: 1px solid @crust; }
#workspaces button { color: @subtext0; }
#workspaces button:hover { background: @hover; }
#workspaces button.active, #workspaces button.focused { color: @text_hi; box-shadow: inset 0 -2px @yellow; }
#workspaces button.urgent { color: @orange; }
#battery.warning { color: @yellow; }
#battery.critical { color: @orange; }In ~/.config/waybar/style.css, at the top
@import "paris-guimard.css";
window#waybar { background: @mantle; color: @text; border-bottom: 1px solid @crust; }
#workspaces button { color: @subtext0; }
#workspaces button:hover { background: @hover; }
#workspaces button.active, #workspaces button.focused { color: @text_hi; box-shadow: inset 0 -2px @yellow; }
#workspaces button.urgent { color: @orange; }
#battery.warning { color: @yellow; }
#battery.critical { color: @orange; }In ~/.config/waybar/style.css, at the top
@import "paris-catacombes.css";
window#waybar { background: @mantle; color: @text; border-bottom: 1px solid @crust; }
#workspaces button { color: @subtext0; }
#workspaces button:hover { background: @hover; }
#workspaces button.active, #workspaces button.focused { color: @text_hi; box-shadow: inset 0 -2px @yellow; }
#workspaces button.urgent { color: @orange; }
#battery.warning { color: @yellow; }
#battery.critical { color: @orange; }In ~/.config/waybar/style.css, at the top
@import "paris-carrelage.css";
window#waybar { background: @mantle; color: @text; border-bottom: 1px solid @crust; }
#workspaces button { color: @subtext0; }
#workspaces button:hover { background: @hover; }
#workspaces button.active, #workspaces button.focused { color: @text_hi; box-shadow: inset 0 -2px @yellow; }
#workspaces button.urgent { color: @orange; }
#battery.warning { color: @yellow; }
#battery.critical { color: @orange; }The files
subway-seat.csssave as ~/.config/waybar/subway-seat.css/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Subway Seat for waybar: @import it at the top of style.css. */
@define-color crust #20160E;
@define-color mantle #2A1D13;
@define-color base #362619;
@define-color surface0 #43301F;
@define-color surface1 #513B27;
@define-color surface2 #634932;
@define-color overlay0 #7B6047;
@define-color overlay1 #967B5C;
@define-color overlay2 #AE9575;
@define-color subtext0 #C4AE8C;
@define-color subtext1 #D9C6A3;
@define-color text #EDDCBC;
@define-color text_hi #F8ECD4;
@define-color yellow #F3BF45;
@define-color yellow_hi #FFD36B;
@define-color orange #EC7F31;
@define-color orange_hi #FF9D55;
@define-color red #E05C45;
@define-color red_hi #FF8373;
@define-color green #ADB956;
@define-color green_hi #BFCB63;
@define-color sage #86AD95;
@define-color sage_hi #A5C9B0;
@define-color denim #7F9BAE;
@define-color denim_hi #9DB6C6;
@define-color clay #F4A87E;
/* Layers: a raised ground for popovers, and washes of text for borders, hover and selection */
@define-color paper #43301F;
@define-color edge alpha(@text, 0.12);
@define-color hover alpha(@text, 0.08);
@define-color selection alpha(@text, 0.16);subway-seat-tunnel.csssave as ~/.config/waybar/subway-seat-tunnel.css/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Subway Seat Tunnel for waybar: @import it at the top of style.css. */
@define-color crust #140D07;
@define-color mantle #1B120A;
@define-color base #24180E;
@define-color surface0 #302115;
@define-color surface1 #3D2C1D;
@define-color surface2 #4F3927;
@define-color overlay0 #745B45;
@define-color overlay1 #917759;
@define-color overlay2 #AA9171;
@define-color subtext0 #C0AA88;
@define-color subtext1 #D6C3A0;
@define-color text #E9D8B6;
@define-color text_hi #F6EAD1;
@define-color yellow #F3BF45;
@define-color yellow_hi #FFD36B;
@define-color orange #EC7F31;
@define-color orange_hi #FF9D55;
@define-color red #E05C45;
@define-color red_hi #FF8373;
@define-color green #ADB956;
@define-color green_hi #BFCB63;
@define-color sage #86AD95;
@define-color sage_hi #A5C9B0;
@define-color denim #7F9BAE;
@define-color denim_hi #9DB6C6;
@define-color clay #F4A87E;
/* Layers: a raised ground for popovers, and washes of text for borders, hover and selection */
@define-color paper #302115;
@define-color edge alpha(@text, 0.12);
@define-color hover alpha(@text, 0.08);
@define-color selection alpha(@text, 0.16);subway-seat-enamel.csssave as ~/.config/waybar/subway-seat-enamel.css/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Subway Seat Enamel for waybar: @import it at the top of style.css. */
@define-color crust #E4D8C0;
@define-color mantle #EEE4D0;
@define-color base #F8EFDF;
@define-color surface0 #DBCDB3;
@define-color surface1 #CBB898;
@define-color surface2 #BAA380;
@define-color overlay0 #A58D6D;
@define-color overlay1 #8C7254;
@define-color overlay2 #735C44;
@define-color subtext0 #654F3B;
@define-color subtext1 #54402F;
@define-color text #3E2C1E;
@define-color text_hi #2A1D13;
@define-color yellow #976608;
@define-color yellow_hi #A9720A;
@define-color orange #A04800;
@define-color orange_hi #BA4D0A;
@define-color red #992418;
@define-color red_hi #BF4233;
@define-color green #66740F;
@define-color green_hi #697813;
@define-color sage #3E7157;
@define-color sage_hi #4C8367;
@define-color denim #3F6480;
@define-color denim_hi #517791;
@define-color clay #843811;
/* Layers: a raised ground for popovers, and washes of text for borders, hover and selection */
@define-color paper #FCF7EF;
@define-color edge alpha(@text, 0.14);
@define-color hover alpha(@text, 0.07);
@define-color selection alpha(@text, 0.13);london-moquette.csssave as ~/.config/waybar/london-moquette.css/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* London Moquette for waybar: @import it at the top of style.css. */
@define-color crust #121826;
@define-color mantle #172032;
@define-color base #1E2941;
@define-color surface0 #263451;
@define-color surface1 #303F61;
@define-color surface2 #3D4F72;
@define-color overlay0 #576685;
@define-color overlay1 #73819C;
@define-color overlay2 #8F9AB0;
@define-color subtext0 #A9B2C4;
@define-color subtext1 #C1C9D8;
@define-color text #D8DEEA;
@define-color text_hi #E9EDF5;
@define-color yellow #F2C03F;
@define-color yellow_hi #FFD36C;
@define-color orange #DE8946;
@define-color orange_hi #E5AA7F;
@define-color red #DB6052;
@define-color red_hi #FE8474;
@define-color green #77C581;
@define-color green_hi #9AD2A0;
@define-color sage #54B4B5;
@define-color sage_hi #72D1D3;
@define-color denim #7595DA;
@define-color denim_hi #8BB0FF;
@define-color clay #AE9EDC;
/* Layers: a raised ground for popovers, and washes of text for borders, hover and selection */
@define-color paper #263451;
@define-color edge alpha(@text, 0.12);
@define-color hover alpha(@text, 0.08);
@define-color selection alpha(@text, 0.16);london-deep-level.csssave as ~/.config/waybar/london-deep-level.css/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* London Deep Level for waybar: @import it at the top of style.css. */
@define-color crust #0A0E18;
@define-color mantle #0D1421;
@define-color base #121A2D;
@define-color surface0 #1A243A;
@define-color surface1 #232F49;
@define-color surface2 #303E5B;
@define-color overlay0 #53617D;
@define-color overlay1 #6F7C97;
@define-color overlay2 #8B96AC;
@define-color subtext0 #A5AEC0;
@define-color subtext1 #BEC6D5;
@define-color text #D4DAE7;
@define-color text_hi #E7EBF3;
@define-color yellow #F2C03F;
@define-color yellow_hi #FFD36C;
@define-color orange #DE8946;
@define-color orange_hi #E5AA7F;
@define-color red #DB6052;
@define-color red_hi #FE8474;
@define-color green #77C581;
@define-color green_hi #9AD2A0;
@define-color sage #54B4B5;
@define-color sage_hi #72D1D3;
@define-color denim #7595DA;
@define-color denim_hi #8BB0FF;
@define-color clay #AE9EDC;
/* Layers: a raised ground for popovers, and washes of text for borders, hover and selection */
@define-color paper #1A243A;
@define-color edge alpha(@text, 0.12);
@define-color hover alpha(@text, 0.08);
@define-color selection alpha(@text, 0.16);london-portland.csssave as ~/.config/waybar/london-portland.css/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* London Portland for waybar: @import it at the top of style.css. */
@define-color crust #CCDAF2;
@define-color mantle #DCE5F7;
@define-color base #E8F0FF;
@define-color surface0 #BFCFF1;
@define-color surface1 #A8BBE2;
@define-color surface2 #93A7CF;
@define-color overlay0 #8192B4;
@define-color overlay1 #697794;
@define-color overlay2 #556179;
@define-color subtext0 #4A5469;
@define-color subtext1 #3C4557;
@define-color text #293040;
@define-color text_hi #1B202B;
@define-color yellow #8D6C08;
@define-color yellow_hi #9B770A;
@define-color orange #A54300;
@define-color orange_hi #AC5A00;
@define-color red #9B211A;
@define-color red_hi #CC2E25;
@define-color green #0D8131;
@define-color green_hi #008730;
@define-color sage #007376;
@define-color sage_hi #008688;
@define-color denim #0019A8;
@define-color denim_hi #4A6EBD;
@define-color clay #755FA9;
/* Layers: a raised ground for popovers, and washes of text for borders, hover and selection */
@define-color paper #F4F8FF;
@define-color edge alpha(@text, 0.14);
@define-color hover alpha(@text, 0.07);
@define-color selection alpha(@text, 0.13);paris-guimard.csssave as ~/.config/waybar/paris-guimard.css/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Paris Guimard for waybar: @import it at the top of style.css. */
@define-color crust #131A17;
@define-color mantle #18241D;
@define-color base #1E2E26;
@define-color surface0 #263930;
@define-color surface1 #30463B;
@define-color surface2 #3E554A;
@define-color overlay0 #586B61;
@define-color overlay1 #74857C;
@define-color overlay2 #909E96;
@define-color subtext0 #A9B5AE;
@define-color subtext1 #C2CBC5;
@define-color text #D9E1DB;
@define-color text_hi #E9EEEC;
@define-color yellow #F1BF4B;
@define-color yellow_hi #FFD57A;
@define-color orange #CA9245;
@define-color orange_hi #DFAA61;
@define-color red #C7665B;
@define-color red_hi #E7877B;
@define-color green #70CAA9;
@define-color green_hi #89DEBE;
@define-color sage #549B9F;
@define-color sage_hi #70B5B9;
@define-color denim #709BC8;
@define-color denim_hi #8DB6E2;
@define-color clay #FAB49C;
/* Layers: a raised ground for popovers, and washes of text for borders, hover and selection */
@define-color paper #263930;
@define-color edge alpha(@text, 0.12);
@define-color hover alpha(@text, 0.08);
@define-color selection alpha(@text, 0.16);paris-catacombes.csssave as ~/.config/waybar/paris-catacombes.css/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Paris Catacombes for waybar: @import it at the top of style.css. */
@define-color crust #0A100D;
@define-color mantle #0D1711;
@define-color base #121E19;
@define-color surface0 #1A2921;
@define-color surface1 #24342C;
@define-color surface2 #31433A;
@define-color overlay0 #54655C;
@define-color overlay1 #708178;
@define-color overlay2 #8C9A92;
@define-color subtext0 #A5B1AA;
@define-color subtext1 #BFC8C2;
@define-color text #D4DDD7;
@define-color text_hi #E7ECEA;
@define-color yellow #F1BF4B;
@define-color yellow_hi #FFD57A;
@define-color orange #CA9245;
@define-color orange_hi #DFAA61;
@define-color red #C7665B;
@define-color red_hi #E7877B;
@define-color green #70CAA9;
@define-color green_hi #89DEBE;
@define-color sage #549B9F;
@define-color sage_hi #70B5B9;
@define-color denim #709BC8;
@define-color denim_hi #8DB6E2;
@define-color clay #FAB49C;
/* Layers: a raised ground for popovers, and washes of text for borders, hover and selection */
@define-color paper #1A2921;
@define-color edge alpha(@text, 0.12);
@define-color hover alpha(@text, 0.08);
@define-color selection alpha(@text, 0.16);paris-carrelage.csssave as ~/.config/waybar/paris-carrelage.css/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Paris Carrelage for waybar: @import it at the top of style.css. */
@define-color crust #D5DBDA;
@define-color mantle #E1E6E5;
@define-color base #EEF2F1;
@define-color surface0 #C6D2CF;
@define-color surface1 #B0BFBB;
@define-color surface2 #99ABA6;
@define-color overlay0 #859792;
@define-color overlay1 #6C7C76;
@define-color overlay2 #56645F;
@define-color subtext0 #4A5752;
@define-color subtext1 #3B4742;
@define-color text #27342F;
@define-color text_hi #19221E;
@define-color yellow #916D07;
@define-color yellow_hi #A07A12;
@define-color orange #764C00;
@define-color orange_hi #885A00;
@define-color red #88251E;
@define-color red_hi #AC3B32;
@define-color green #218366;
@define-color green_hi #278D6E;
@define-color sage #006267;
@define-color sage_hi #027479;
@define-color denim #25629B;
@define-color denim_hi #3D75AD;
@define-color clay #B36B51;
/* Layers: a raised ground for popovers, and washes of text for borders, hover and selection */
@define-color paper #F6F8F8;
@define-color edge alpha(@text, 0.14);
@define-color hover alpha(@text, 0.07);
@define-color selection alpha(@text, 0.13);