Skip to content
Subway SeatSubway SeatSubway Seat
← All ports

Terminals

Hyper

Colors, cursor, selection, borders and the tab strip. Hyper 3 loads local plugins from ~/.hyper_plugins/local/ ($XDG_CONFIG_HOME/hyper/.hyper_plugins/local/ when that's set, %APPDATA%\Hyper\.hyper_plugins\local\ on Windows). The Hyper 4 canary reads hyper.json and ~/.config/Hyper/plugins/local/. Hyper doesn't follow the system light/dark setting, so pick one flavor.

Showing WalnutTunnelEnamelMoquetteDeep LevelPortlandGuimardCatacombesCarrelage. Switch flavors with the bullets up top.

Hyper 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 hyper
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor tunnel --only hyper
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor enamel --only hyper
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor moquette --only hyper
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor deep --only hyper
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor portland --only hyper
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor guimard --only hyper
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor catacombes --only hyper
curl -fsSL https://oddurs.github.io/subway-seat/install.sh | sh -s -- --flavor carrelage --only hyper

Turn it on

In ~/.hyper.js
localPlugins: ['subway-seat'],
In ~/.hyper.js
localPlugins: ['subway-seat-tunnel'],
In ~/.hyper.js
localPlugins: ['subway-seat-enamel'],
In ~/.hyper.js
localPlugins: ['london-moquette'],
In ~/.hyper.js
localPlugins: ['london-deep-level'],
In ~/.hyper.js
localPlugins: ['london-portland'],
In ~/.hyper.js
localPlugins: ['paris-guimard'],
In ~/.hyper.js
localPlugins: ['paris-catacombes'],
In ~/.hyper.js
localPlugins: ['paris-carrelage'],

The files

subway-seat/index.jssave as ~/.hyper_plugins/local/subway-seat/index.js
// Subway Seat — generated from palette.py by build.py. Edit the palette, not this file.
// Subway Seat. Enable with localPlugins: ["subway-seat"] in ~/.hyper.js.
// selectionColor is a translucent wash of the text color, not the solid selection color the other
// terminals use: Hyper's xterm.js draws the selection over the glyphs, so an opaque color would hide them.
"use strict";

const theme = {
  "backgroundColor": "#362619",
  "foregroundColor": "#EDDCBC",
  "cursorColor": "#F3BF45",
  "cursorAccentColor": "#362619",
  "selectionColor": "#EDDCBC33",
  "borderColor": "#43301F",
  "colors": {
    "black": "#513B27",
    "red": "#E05C45",
    "green": "#ADB956",
    "yellow": "#F3BF45",
    "blue": "#7F9BAE",
    "magenta": "#EC7F31",
    "cyan": "#86AD95",
    "white": "#D9C6A3",
    "lightBlack": "#967B5C",
    "lightRed": "#FF8373",
    "lightGreen": "#BFCB63",
    "lightYellow": "#FFD36B",
    "lightBlue": "#9DB6C6",
    "lightMagenta": "#FF9D55",
    "lightCyan": "#A5C9B0",
    "lightWhite": "#F8ECD4"
  }
};

const css = `
  .tabs_nav, .tabs_list { background-color: #20160E; }
  .tabs_title { color: #C4AE8C; }
  .tab_tab { color: #967B5C; background-color: #20160E; }
  .tab_tab.tab_active { color: #F8ECD4; background-color: #362619; box-shadow: inset 0 -2px 0 #F3BF45; }
`;

exports.decorateConfig = (config) =>
  Object.assign({}, config, theme, { css: `${css}${config.css || ""}` });
subway-seat-tunnel/index.jssave as ~/.hyper_plugins/local/subway-seat-tunnel/index.js
// Subway Seat — generated from palette.py by build.py. Edit the palette, not this file.
// Subway Seat Tunnel. Enable with localPlugins: ["subway-seat-tunnel"] in ~/.hyper.js.
// selectionColor is a translucent wash of the text color, not the solid selection color the other
// terminals use: Hyper's xterm.js draws the selection over the glyphs, so an opaque color would hide them.
"use strict";

const theme = {
  "backgroundColor": "#24180E",
  "foregroundColor": "#E9D8B6",
  "cursorColor": "#F3BF45",
  "cursorAccentColor": "#24180E",
  "selectionColor": "#E9D8B633",
  "borderColor": "#302115",
  "colors": {
    "black": "#3D2C1D",
    "red": "#E05C45",
    "green": "#ADB956",
    "yellow": "#F3BF45",
    "blue": "#7F9BAE",
    "magenta": "#EC7F31",
    "cyan": "#86AD95",
    "white": "#D6C3A0",
    "lightBlack": "#917759",
    "lightRed": "#FF8373",
    "lightGreen": "#BFCB63",
    "lightYellow": "#FFD36B",
    "lightBlue": "#9DB6C6",
    "lightMagenta": "#FF9D55",
    "lightCyan": "#A5C9B0",
    "lightWhite": "#F6EAD1"
  }
};

const css = `
  .tabs_nav, .tabs_list { background-color: #140D07; }
  .tabs_title { color: #C0AA88; }
  .tab_tab { color: #917759; background-color: #140D07; }
  .tab_tab.tab_active { color: #F6EAD1; background-color: #24180E; box-shadow: inset 0 -2px 0 #F3BF45; }
`;

exports.decorateConfig = (config) =>
  Object.assign({}, config, theme, { css: `${css}${config.css || ""}` });
subway-seat-enamel/index.jssave as ~/.hyper_plugins/local/subway-seat-enamel/index.js
// Subway Seat — generated from palette.py by build.py. Edit the palette, not this file.
// Subway Seat Enamel. Enable with localPlugins: ["subway-seat-enamel"] in ~/.hyper.js.
// selectionColor is a translucent wash of the text color, not the solid selection color the other
// terminals use: Hyper's xterm.js draws the selection over the glyphs, so an opaque color would hide them.
"use strict";

const theme = {
  "backgroundColor": "#F8EFDF",
  "foregroundColor": "#3E2C1E",
  "cursorColor": "#A04800",
  "cursorAccentColor": "#F8EFDF",
  "selectionColor": "#3E2C1E33",
  "borderColor": "#E4D8C0",
  "colors": {
    "black": "#54402F",
    "red": "#992418",
    "green": "#66740F",
    "yellow": "#976608",
    "blue": "#3F6480",
    "magenta": "#A04800",
    "cyan": "#3E7157",
    "white": "#BAA380",
    "lightBlack": "#8C7254",
    "lightRed": "#BF4233",
    "lightGreen": "#697813",
    "lightYellow": "#A9720A",
    "lightBlue": "#517791",
    "lightMagenta": "#BA4D0A",
    "lightCyan": "#4C8367",
    "lightWhite": "#CBB898"
  }
};

const css = `
  .tabs_nav, .tabs_list { background-color: #E4D8C0; }
  .tabs_title { color: #654F3B; }
  .tab_tab { color: #8C7254; background-color: #E4D8C0; }
  .tab_tab.tab_active { color: #2A1D13; background-color: #F8EFDF; box-shadow: inset 0 -2px 0 #A04800; }
`;

exports.decorateConfig = (config) =>
  Object.assign({}, config, theme, { css: `${css}${config.css || ""}` });
london-moquette/index.jssave as ~/.hyper_plugins/local/london-moquette/index.js
// Subway Seat — generated from palette.py by build.py. Edit the palette, not this file.
// London Moquette. Enable with localPlugins: ["london-moquette"] in ~/.hyper.js.
// selectionColor is a translucent wash of the text color, not the solid selection color the other
// terminals use: Hyper's xterm.js draws the selection over the glyphs, so an opaque color would hide them.
"use strict";

const theme = {
  "backgroundColor": "#1E2941",
  "foregroundColor": "#D8DEEA",
  "cursorColor": "#F2C03F",
  "cursorAccentColor": "#1E2941",
  "selectionColor": "#D8DEEA33",
  "borderColor": "#263451",
  "colors": {
    "black": "#303F61",
    "red": "#DB6052",
    "green": "#77C581",
    "yellow": "#F2C03F",
    "blue": "#7595DA",
    "magenta": "#DE8946",
    "cyan": "#54B4B5",
    "white": "#C1C9D8",
    "lightBlack": "#73819C",
    "lightRed": "#FE8474",
    "lightGreen": "#9AD2A0",
    "lightYellow": "#FFD36C",
    "lightBlue": "#8BB0FF",
    "lightMagenta": "#E5AA7F",
    "lightCyan": "#72D1D3",
    "lightWhite": "#E9EDF5"
  }
};

const css = `
  .tabs_nav, .tabs_list { background-color: #121826; }
  .tabs_title { color: #A9B2C4; }
  .tab_tab { color: #73819C; background-color: #121826; }
  .tab_tab.tab_active { color: #E9EDF5; background-color: #1E2941; box-shadow: inset 0 -2px 0 #F2C03F; }
`;

exports.decorateConfig = (config) =>
  Object.assign({}, config, theme, { css: `${css}${config.css || ""}` });
london-deep-level/index.jssave as ~/.hyper_plugins/local/london-deep-level/index.js
// Subway Seat — generated from palette.py by build.py. Edit the palette, not this file.
// London Deep Level. Enable with localPlugins: ["london-deep-level"] in ~/.hyper.js.
// selectionColor is a translucent wash of the text color, not the solid selection color the other
// terminals use: Hyper's xterm.js draws the selection over the glyphs, so an opaque color would hide them.
"use strict";

const theme = {
  "backgroundColor": "#121A2D",
  "foregroundColor": "#D4DAE7",
  "cursorColor": "#F2C03F",
  "cursorAccentColor": "#121A2D",
  "selectionColor": "#D4DAE733",
  "borderColor": "#1A243A",
  "colors": {
    "black": "#232F49",
    "red": "#DB6052",
    "green": "#77C581",
    "yellow": "#F2C03F",
    "blue": "#7595DA",
    "magenta": "#DE8946",
    "cyan": "#54B4B5",
    "white": "#BEC6D5",
    "lightBlack": "#6F7C97",
    "lightRed": "#FE8474",
    "lightGreen": "#9AD2A0",
    "lightYellow": "#FFD36C",
    "lightBlue": "#8BB0FF",
    "lightMagenta": "#E5AA7F",
    "lightCyan": "#72D1D3",
    "lightWhite": "#E7EBF3"
  }
};

const css = `
  .tabs_nav, .tabs_list { background-color: #0A0E18; }
  .tabs_title { color: #A5AEC0; }
  .tab_tab { color: #6F7C97; background-color: #0A0E18; }
  .tab_tab.tab_active { color: #E7EBF3; background-color: #121A2D; box-shadow: inset 0 -2px 0 #F2C03F; }
`;

exports.decorateConfig = (config) =>
  Object.assign({}, config, theme, { css: `${css}${config.css || ""}` });
london-portland/index.jssave as ~/.hyper_plugins/local/london-portland/index.js
// Subway Seat — generated from palette.py by build.py. Edit the palette, not this file.
// London Portland. Enable with localPlugins: ["london-portland"] in ~/.hyper.js.
// selectionColor is a translucent wash of the text color, not the solid selection color the other
// terminals use: Hyper's xterm.js draws the selection over the glyphs, so an opaque color would hide them.
"use strict";

const theme = {
  "backgroundColor": "#E8F0FF",
  "foregroundColor": "#293040",
  "cursorColor": "#A54300",
  "cursorAccentColor": "#E8F0FF",
  "selectionColor": "#29304033",
  "borderColor": "#CCDAF2",
  "colors": {
    "black": "#3C4557",
    "red": "#9B211A",
    "green": "#0D8131",
    "yellow": "#8D6C08",
    "blue": "#0019A8",
    "magenta": "#A54300",
    "cyan": "#007376",
    "white": "#93A7CF",
    "lightBlack": "#697794",
    "lightRed": "#CC2E25",
    "lightGreen": "#008730",
    "lightYellow": "#9B770A",
    "lightBlue": "#4A6EBD",
    "lightMagenta": "#AC5A00",
    "lightCyan": "#008688",
    "lightWhite": "#A8BBE2"
  }
};

const css = `
  .tabs_nav, .tabs_list { background-color: #CCDAF2; }
  .tabs_title { color: #4A5469; }
  .tab_tab { color: #697794; background-color: #CCDAF2; }
  .tab_tab.tab_active { color: #1B202B; background-color: #E8F0FF; box-shadow: inset 0 -2px 0 #A54300; }
`;

exports.decorateConfig = (config) =>
  Object.assign({}, config, theme, { css: `${css}${config.css || ""}` });
paris-guimard/index.jssave as ~/.hyper_plugins/local/paris-guimard/index.js
// Subway Seat — generated from palette.py by build.py. Edit the palette, not this file.
// Paris Guimard. Enable with localPlugins: ["paris-guimard"] in ~/.hyper.js.
// selectionColor is a translucent wash of the text color, not the solid selection color the other
// terminals use: Hyper's xterm.js draws the selection over the glyphs, so an opaque color would hide them.
"use strict";

const theme = {
  "backgroundColor": "#1E2E26",
  "foregroundColor": "#D9E1DB",
  "cursorColor": "#F1BF4B",
  "cursorAccentColor": "#1E2E26",
  "selectionColor": "#D9E1DB33",
  "borderColor": "#263930",
  "colors": {
    "black": "#30463B",
    "red": "#C7665B",
    "green": "#70CAA9",
    "yellow": "#F1BF4B",
    "blue": "#709BC8",
    "magenta": "#CA9245",
    "cyan": "#549B9F",
    "white": "#C2CBC5",
    "lightBlack": "#74857C",
    "lightRed": "#E7877B",
    "lightGreen": "#89DEBE",
    "lightYellow": "#FFD57A",
    "lightBlue": "#8DB6E2",
    "lightMagenta": "#DFAA61",
    "lightCyan": "#70B5B9",
    "lightWhite": "#E9EEEC"
  }
};

const css = `
  .tabs_nav, .tabs_list { background-color: #131A17; }
  .tabs_title { color: #A9B5AE; }
  .tab_tab { color: #74857C; background-color: #131A17; }
  .tab_tab.tab_active { color: #E9EEEC; background-color: #1E2E26; box-shadow: inset 0 -2px 0 #F1BF4B; }
`;

exports.decorateConfig = (config) =>
  Object.assign({}, config, theme, { css: `${css}${config.css || ""}` });
paris-catacombes/index.jssave as ~/.hyper_plugins/local/paris-catacombes/index.js
// Subway Seat — generated from palette.py by build.py. Edit the palette, not this file.
// Paris Catacombes. Enable with localPlugins: ["paris-catacombes"] in ~/.hyper.js.
// selectionColor is a translucent wash of the text color, not the solid selection color the other
// terminals use: Hyper's xterm.js draws the selection over the glyphs, so an opaque color would hide them.
"use strict";

const theme = {
  "backgroundColor": "#121E19",
  "foregroundColor": "#D4DDD7",
  "cursorColor": "#F1BF4B",
  "cursorAccentColor": "#121E19",
  "selectionColor": "#D4DDD733",
  "borderColor": "#1A2921",
  "colors": {
    "black": "#24342C",
    "red": "#C7665B",
    "green": "#70CAA9",
    "yellow": "#F1BF4B",
    "blue": "#709BC8",
    "magenta": "#CA9245",
    "cyan": "#549B9F",
    "white": "#BFC8C2",
    "lightBlack": "#708178",
    "lightRed": "#E7877B",
    "lightGreen": "#89DEBE",
    "lightYellow": "#FFD57A",
    "lightBlue": "#8DB6E2",
    "lightMagenta": "#DFAA61",
    "lightCyan": "#70B5B9",
    "lightWhite": "#E7ECEA"
  }
};

const css = `
  .tabs_nav, .tabs_list { background-color: #0A100D; }
  .tabs_title { color: #A5B1AA; }
  .tab_tab { color: #708178; background-color: #0A100D; }
  .tab_tab.tab_active { color: #E7ECEA; background-color: #121E19; box-shadow: inset 0 -2px 0 #F1BF4B; }
`;

exports.decorateConfig = (config) =>
  Object.assign({}, config, theme, { css: `${css}${config.css || ""}` });
paris-carrelage/index.jssave as ~/.hyper_plugins/local/paris-carrelage/index.js
// Subway Seat — generated from palette.py by build.py. Edit the palette, not this file.
// Paris Carrelage. Enable with localPlugins: ["paris-carrelage"] in ~/.hyper.js.
// selectionColor is a translucent wash of the text color, not the solid selection color the other
// terminals use: Hyper's xterm.js draws the selection over the glyphs, so an opaque color would hide them.
"use strict";

const theme = {
  "backgroundColor": "#EEF2F1",
  "foregroundColor": "#27342F",
  "cursorColor": "#764C00",
  "cursorAccentColor": "#EEF2F1",
  "selectionColor": "#27342F33",
  "borderColor": "#D5DBDA",
  "colors": {
    "black": "#3B4742",
    "red": "#88251E",
    "green": "#218366",
    "yellow": "#916D07",
    "blue": "#25629B",
    "magenta": "#764C00",
    "cyan": "#006267",
    "white": "#99ABA6",
    "lightBlack": "#6C7C76",
    "lightRed": "#AC3B32",
    "lightGreen": "#278D6E",
    "lightYellow": "#A07A12",
    "lightBlue": "#3D75AD",
    "lightMagenta": "#885A00",
    "lightCyan": "#027479",
    "lightWhite": "#B0BFBB"
  }
};

const css = `
  .tabs_nav, .tabs_list { background-color: #D5DBDA; }
  .tabs_title { color: #4A5752; }
  .tab_tab { color: #6C7C76; background-color: #D5DBDA; }
  .tab_tab.tab_active { color: #19221E; background-color: #EEF2F1; box-shadow: inset 0 -2px 0 #764C00; }
`;

exports.decorateConfig = (config) =>
  Object.assign({}, config, theme, { css: `${css}${config.css || ""}` });