Skip to content
Subway SeatSubway SeatSubway Seat
← All ports

Palettes & formats

highlight.js

A highlight.js stylesheet per flavor, using the same syntax colors as the editor themes, and subway-seat-auto.css, which follows the system's light or dark setting. In diffs, added and removed lines sit on green and red grounds and hunk headers are denim.

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

highlight.js 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

Turn it on

In your page's <head>, in place of a stock highlight.js theme
<link rel="stylesheet" href="subway-seat.css">
In your page's <head>, in place of a stock highlight.js theme
<link rel="stylesheet" href="subway-seat-tunnel.css">
In your page's <head>, in place of a stock highlight.js theme
<link rel="stylesheet" href="subway-seat-enamel.css">
In your page's <head>, in place of a stock highlight.js theme
<link rel="stylesheet" href="london-moquette.css">
In your page's <head>, in place of a stock highlight.js theme
<link rel="stylesheet" href="london-deep-level.css">
In your page's <head>, in place of a stock highlight.js theme
<link rel="stylesheet" href="london-portland.css">
In your page's <head>, in place of a stock highlight.js theme
<link rel="stylesheet" href="paris-guimard.css">
In your page's <head>, in place of a stock highlight.js theme
<link rel="stylesheet" href="paris-catacombes.css">
In your page's <head>, in place of a stock highlight.js theme
<link rel="stylesheet" href="paris-carrelage.css">

Follow light and dark

One setting that changes with your system’s light and dark mode, no switching by hand.

In your page's <head>, in place of a stock highlight.js theme
<link rel="stylesheet" href="subway-seat-auto.css">
<!-- Enamel while the system is light, Subway Seat (Walnut) while it's dark -->

The files

Download all (.zip)Download all (.zip)Download all (.zip)Download all (.zip)Download all (.zip)Download all (.zip)Download all (.zip)Download all (.zip)Download all (.zip)
subway-seat.csssave as styles/highlightjs/subway-seat.css
in your site's stylesheets
Download
/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Subway Seat for highlight.js */

pre code.hljs { display: block; overflow-x: auto; padding: 1em; }
code.hljs { padding: 3px 5px; }
.hljs-addition, .hljs-deletion { display: inline-block; width: 100%; } /* diff lines as full-width bands */

.hljs { color: #EDDCBC; background: #362619; }
.hljs::selection, .hljs ::selection { color: #F8ECD4; background: #634932; }

.hljs-comment { color: #967B5C; font-style: italic; }
.hljs-quote { color: #C4AE8C; font-style: italic; }
.hljs-doctag, .hljs-meta, .hljs-meta .hljs-keyword { color: #F4A87E; font-style: italic; }
.hljs-meta .hljs-string { color: #ADB956; }
.hljs-keyword, .hljs-template-tag { color: #EC7F31; }
.hljs-operator { color: #AE9575; }
.hljs-punctuation, .hljs-tag { color: #AE9575; }
.hljs-title, .hljs-title.function_, .hljs-title.function_.invoke__, .hljs-attr { color: #F3BF45; }
.hljs-built_in { color: #F3BF45; font-style: italic; }
.hljs-string, .hljs-code { color: #ADB956; }
.hljs-char.escape_ { color: #F4A87E; }
.hljs-regexp { color: #F4A87E; }
.hljs-number { color: #FF8373; }
.hljs-literal, .hljs-symbol, .hljs-variable.constant_, .hljs-formula { color: #FF8373; }
.hljs-title.class_, .hljs-title.class_.inherited__ { color: #86AD95; }
.hljs-type { color: #86AD95; font-style: italic; }
.hljs-variable, .hljs-template-variable, .hljs-subst { color: #EDDCBC; }
.hljs-variable.language_ { color: #FF8373; font-style: italic; }
.hljs-params { color: #D9C6A3; font-style: italic; }
.hljs-property, .hljs-attribute { color: #D9C6A3; }
.hljs-name, .hljs-selector-tag { color: #EC7F31; }
.hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #F3BF45; font-style: italic; }
.hljs-section { color: #F3BF45; font-weight: bold; }
.hljs-bullet { color: #EC7F31; }
.hljs-emphasis { color: #EDDCBC; font-style: italic; }
.hljs-strong { color: #F8ECD4; font-weight: bold; }
.hljs-link { color: #7F9BAE; text-decoration: underline; }

/* Diffs: a diff line is one token, so it takes green or red_hi on its tint.
   highlight.js marks hunk headers as meta and file headers as comments. */
.hljs-addition { color: #ADB956; background: #3F3A1E; }
.hljs-deletion { color: #FF8373; background: #52281C; }
.language-diff .hljs-meta { color: #7F9BAE; font-style: normal; }
.language-diff .hljs-comment { color: #F8ECD4; font-style: normal; font-weight: bold; }
subway-seat-tunnel.csssave as styles/highlightjs/subway-seat-tunnel.css
in your site's stylesheets
Download
/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Subway Seat Tunnel for highlight.js */

pre code.hljs { display: block; overflow-x: auto; padding: 1em; }
code.hljs { padding: 3px 5px; }
.hljs-addition, .hljs-deletion { display: inline-block; width: 100%; } /* diff lines as full-width bands */

.hljs { color: #E9D8B6; background: #24180E; }
.hljs::selection, .hljs ::selection { color: #F6EAD1; background: #4F3927; }

.hljs-comment { color: #917759; font-style: italic; }
.hljs-quote { color: #C0AA88; font-style: italic; }
.hljs-doctag, .hljs-meta, .hljs-meta .hljs-keyword { color: #F4A87E; font-style: italic; }
.hljs-meta .hljs-string { color: #ADB956; }
.hljs-keyword, .hljs-template-tag { color: #EC7F31; }
.hljs-operator { color: #AA9171; }
.hljs-punctuation, .hljs-tag { color: #AA9171; }
.hljs-title, .hljs-title.function_, .hljs-title.function_.invoke__, .hljs-attr { color: #F3BF45; }
.hljs-built_in { color: #F3BF45; font-style: italic; }
.hljs-string, .hljs-code { color: #ADB956; }
.hljs-char.escape_ { color: #F4A87E; }
.hljs-regexp { color: #F4A87E; }
.hljs-number { color: #FF8373; }
.hljs-literal, .hljs-symbol, .hljs-variable.constant_, .hljs-formula { color: #FF8373; }
.hljs-title.class_, .hljs-title.class_.inherited__ { color: #86AD95; }
.hljs-type { color: #86AD95; font-style: italic; }
.hljs-variable, .hljs-template-variable, .hljs-subst { color: #E9D8B6; }
.hljs-variable.language_ { color: #FF8373; font-style: italic; }
.hljs-params { color: #D6C3A0; font-style: italic; }
.hljs-property, .hljs-attribute { color: #D6C3A0; }
.hljs-name, .hljs-selector-tag { color: #EC7F31; }
.hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #F3BF45; font-style: italic; }
.hljs-section { color: #F3BF45; font-weight: bold; }
.hljs-bullet { color: #EC7F31; }
.hljs-emphasis { color: #E9D8B6; font-style: italic; }
.hljs-strong { color: #F6EAD1; font-weight: bold; }
.hljs-link { color: #7F9BAE; text-decoration: underline; }

/* Diffs: a diff line is one token, so it takes green or red_hi on its tint.
   highlight.js marks hunk headers as meta and file headers as comments. */
.hljs-addition { color: #ADB956; background: #363318; }
.hljs-deletion { color: #FF8373; background: #492217; }
.language-diff .hljs-meta { color: #7F9BAE; font-style: normal; }
.language-diff .hljs-comment { color: #F6EAD1; font-style: normal; font-weight: bold; }
subway-seat-enamel.csssave as styles/highlightjs/subway-seat-enamel.css
in your site's stylesheets
Download
/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Subway Seat Enamel for highlight.js */

pre code.hljs { display: block; overflow-x: auto; padding: 1em; }
code.hljs { padding: 3px 5px; }
.hljs-addition, .hljs-deletion { display: inline-block; width: 100%; } /* diff lines as full-width bands */

.hljs { color: #3E2C1E; background: #F8EFDF; }
.hljs::selection, .hljs ::selection { color: #2A1D13; background: #CBB898; }

.hljs-comment { color: #8C7254; font-style: italic; }
.hljs-quote { color: #654F3B; font-style: italic; }
.hljs-doctag, .hljs-meta, .hljs-meta .hljs-keyword { color: #843811; font-style: italic; }
.hljs-meta .hljs-string { color: #66740F; }
.hljs-keyword, .hljs-template-tag { color: #A04800; }
.hljs-operator { color: #735C44; }
.hljs-punctuation, .hljs-tag { color: #735C44; }
.hljs-title, .hljs-title.function_, .hljs-title.function_.invoke__, .hljs-attr { color: #976608; }
.hljs-built_in { color: #976608; font-style: italic; }
.hljs-string, .hljs-code { color: #66740F; }
.hljs-char.escape_ { color: #843811; }
.hljs-regexp { color: #843811; }
.hljs-number { color: #BF4233; }
.hljs-literal, .hljs-symbol, .hljs-variable.constant_, .hljs-formula { color: #BF4233; }
.hljs-title.class_, .hljs-title.class_.inherited__ { color: #3E7157; }
.hljs-type { color: #3E7157; font-style: italic; }
.hljs-variable, .hljs-template-variable, .hljs-subst { color: #3E2C1E; }
.hljs-variable.language_ { color: #BF4233; font-style: italic; }
.hljs-params { color: #54402F; font-style: italic; }
.hljs-property, .hljs-attribute { color: #54402F; }
.hljs-name, .hljs-selector-tag { color: #A04800; }
.hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #976608; font-style: italic; }
.hljs-section { color: #976608; font-weight: bold; }
.hljs-bullet { color: #A04800; }
.hljs-emphasis { color: #3E2C1E; font-style: italic; }
.hljs-strong { color: #2A1D13; font-weight: bold; }
.hljs-link { color: #3F6480; text-decoration: underline; }

/* Diffs: a diff line is one token, so it takes green or red_hi on its tint.
   highlight.js marks hunk headers as meta and file headers as comments. */
.hljs-addition { color: #66740F; background: #D7DBC1; }
.hljs-deletion { color: #BF4233; background: #EBD3D1; }
.language-diff .hljs-meta { color: #3F6480; font-style: normal; }
.language-diff .hljs-comment { color: #2A1D13; font-style: normal; font-weight: bold; }
london-moquette.csssave as styles/highlightjs/london-moquette.css
in your site's stylesheets
Download
/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* London Moquette for highlight.js */

pre code.hljs { display: block; overflow-x: auto; padding: 1em; }
code.hljs { padding: 3px 5px; }
.hljs-addition, .hljs-deletion { display: inline-block; width: 100%; } /* diff lines as full-width bands */

.hljs { color: #D8DEEA; background: #1E2941; }
.hljs::selection, .hljs ::selection { color: #E9EDF5; background: #3D4F72; }

.hljs-comment { color: #73819C; font-style: italic; }
.hljs-quote { color: #A9B2C4; font-style: italic; }
.hljs-doctag, .hljs-meta, .hljs-meta .hljs-keyword { color: #AE9EDC; font-style: italic; }
.hljs-meta .hljs-string { color: #77C581; }
.hljs-keyword, .hljs-template-tag { color: #DE8946; }
.hljs-operator { color: #8F9AB0; }
.hljs-punctuation, .hljs-tag { color: #8F9AB0; }
.hljs-title, .hljs-title.function_, .hljs-title.function_.invoke__, .hljs-attr { color: #F2C03F; }
.hljs-built_in { color: #F2C03F; font-style: italic; }
.hljs-string, .hljs-code { color: #77C581; }
.hljs-char.escape_ { color: #AE9EDC; }
.hljs-regexp { color: #AE9EDC; }
.hljs-number { color: #FE8474; }
.hljs-literal, .hljs-symbol, .hljs-variable.constant_, .hljs-formula { color: #FE8474; }
.hljs-title.class_, .hljs-title.class_.inherited__ { color: #54B4B5; }
.hljs-type { color: #54B4B5; font-style: italic; }
.hljs-variable, .hljs-template-variable, .hljs-subst { color: #D8DEEA; }
.hljs-variable.language_ { color: #FE8474; font-style: italic; }
.hljs-params { color: #C1C9D8; font-style: italic; }
.hljs-property, .hljs-attribute { color: #C1C9D8; }
.hljs-name, .hljs-selector-tag { color: #DE8946; }
.hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #F2C03F; font-style: italic; }
.hljs-section { color: #F2C03F; font-weight: bold; }
.hljs-bullet { color: #DE8946; }
.hljs-emphasis { color: #D8DEEA; font-style: italic; }
.hljs-strong { color: #E9EDF5; font-weight: bold; }
.hljs-link { color: #7595DA; text-decoration: underline; }

/* Diffs: a diff line is one token, so it takes green or red_hi on its tint.
   highlight.js marks hunk headers as meta and file headers as comments. */
.hljs-addition { color: #77C581; background: #283E3A; }
.hljs-deletion { color: #FE8474; background: #462B31; }
.language-diff .hljs-meta { color: #7595DA; font-style: normal; }
.language-diff .hljs-comment { color: #E9EDF5; font-style: normal; font-weight: bold; }
london-deep-level.csssave as styles/highlightjs/london-deep-level.css
in your site's stylesheets
Download
/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* London Deep Level for highlight.js */

pre code.hljs { display: block; overflow-x: auto; padding: 1em; }
code.hljs { padding: 3px 5px; }
.hljs-addition, .hljs-deletion { display: inline-block; width: 100%; } /* diff lines as full-width bands */

.hljs { color: #D4DAE7; background: #121A2D; }
.hljs::selection, .hljs ::selection { color: #E7EBF3; background: #303E5B; }

.hljs-comment { color: #6F7C97; font-style: italic; }
.hljs-quote { color: #A5AEC0; font-style: italic; }
.hljs-doctag, .hljs-meta, .hljs-meta .hljs-keyword { color: #AE9EDC; font-style: italic; }
.hljs-meta .hljs-string { color: #77C581; }
.hljs-keyword, .hljs-template-tag { color: #DE8946; }
.hljs-operator { color: #8B96AC; }
.hljs-punctuation, .hljs-tag { color: #8B96AC; }
.hljs-title, .hljs-title.function_, .hljs-title.function_.invoke__, .hljs-attr { color: #F2C03F; }
.hljs-built_in { color: #F2C03F; font-style: italic; }
.hljs-string, .hljs-code { color: #77C581; }
.hljs-char.escape_ { color: #AE9EDC; }
.hljs-regexp { color: #AE9EDC; }
.hljs-number { color: #FE8474; }
.hljs-literal, .hljs-symbol, .hljs-variable.constant_, .hljs-formula { color: #FE8474; }
.hljs-title.class_, .hljs-title.class_.inherited__ { color: #54B4B5; }
.hljs-type { color: #54B4B5; font-style: italic; }
.hljs-variable, .hljs-template-variable, .hljs-subst { color: #D4DAE7; }
.hljs-variable.language_ { color: #FE8474; font-style: italic; }
.hljs-params { color: #BEC6D5; font-style: italic; }
.hljs-property, .hljs-attribute { color: #BEC6D5; }
.hljs-name, .hljs-selector-tag { color: #DE8946; }
.hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #F2C03F; font-style: italic; }
.hljs-section { color: #F2C03F; font-weight: bold; }
.hljs-bullet { color: #DE8946; }
.hljs-emphasis { color: #D4DAE7; font-style: italic; }
.hljs-strong { color: #E7EBF3; font-weight: bold; }
.hljs-link { color: #7595DA; text-decoration: underline; }

/* Diffs: a diff line is one token, so it takes green or red_hi on its tint.
   highlight.js marks hunk headers as meta and file headers as comments. */
.hljs-addition { color: #77C581; background: #22362F; }
.hljs-deletion { color: #FE8474; background: #402327; }
.language-diff .hljs-meta { color: #7595DA; font-style: normal; }
.language-diff .hljs-comment { color: #E7EBF3; font-style: normal; font-weight: bold; }
london-portland.csssave as styles/highlightjs/london-portland.css
in your site's stylesheets
Download
/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* London Portland for highlight.js */

pre code.hljs { display: block; overflow-x: auto; padding: 1em; }
code.hljs { padding: 3px 5px; }
.hljs-addition, .hljs-deletion { display: inline-block; width: 100%; } /* diff lines as full-width bands */

.hljs { color: #293040; background: #E8F0FF; }
.hljs::selection, .hljs ::selection { color: #1B202B; background: #A8BBE2; }

.hljs-comment { color: #697794; font-style: italic; }
.hljs-quote { color: #4A5469; font-style: italic; }
.hljs-doctag, .hljs-meta, .hljs-meta .hljs-keyword { color: #755FA9; font-style: italic; }
.hljs-meta .hljs-string { color: #0D8131; }
.hljs-keyword, .hljs-template-tag { color: #A54300; }
.hljs-operator { color: #556179; }
.hljs-punctuation, .hljs-tag { color: #556179; }
.hljs-title, .hljs-title.function_, .hljs-title.function_.invoke__, .hljs-attr { color: #8D6C08; }
.hljs-built_in { color: #8D6C08; font-style: italic; }
.hljs-string, .hljs-code { color: #0D8131; }
.hljs-char.escape_ { color: #755FA9; }
.hljs-regexp { color: #755FA9; }
.hljs-number { color: #CC2E25; }
.hljs-literal, .hljs-symbol, .hljs-variable.constant_, .hljs-formula { color: #CC2E25; }
.hljs-title.class_, .hljs-title.class_.inherited__ { color: #007376; }
.hljs-type { color: #007376; font-style: italic; }
.hljs-variable, .hljs-template-variable, .hljs-subst { color: #293040; }
.hljs-variable.language_ { color: #CC2E25; font-style: italic; }
.hljs-params { color: #3C4557; font-style: italic; }
.hljs-property, .hljs-attribute { color: #3C4557; }
.hljs-name, .hljs-selector-tag { color: #A54300; }
.hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #8D6C08; font-style: italic; }
.hljs-section { color: #8D6C08; font-weight: bold; }
.hljs-bullet { color: #A54300; }
.hljs-emphasis { color: #293040; font-style: italic; }
.hljs-strong { color: #1B202B; font-weight: bold; }
.hljs-link { color: #0019A8; text-decoration: underline; }

/* Diffs: a diff line is one token, so it takes green or red_hi on its tint.
   highlight.js marks hunk headers as meta and file headers as comments. */
.hljs-addition { color: #0D8131; background: #C0DEC9; }
.hljs-deletion { color: #CC2E25; background: #EBD3D1; }
.language-diff .hljs-meta { color: #0019A8; font-style: normal; }
.language-diff .hljs-comment { color: #1B202B; font-style: normal; font-weight: bold; }
paris-guimard.csssave as styles/highlightjs/paris-guimard.css
in your site's stylesheets
Download
/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Paris Guimard for highlight.js */

pre code.hljs { display: block; overflow-x: auto; padding: 1em; }
code.hljs { padding: 3px 5px; }
.hljs-addition, .hljs-deletion { display: inline-block; width: 100%; } /* diff lines as full-width bands */

.hljs { color: #D9E1DB; background: #1E2E26; }
.hljs::selection, .hljs ::selection { color: #E9EEEC; background: #3E554A; }

.hljs-comment { color: #74857C; font-style: italic; }
.hljs-quote { color: #A9B5AE; font-style: italic; }
.hljs-doctag, .hljs-meta, .hljs-meta .hljs-keyword { color: #FAB49C; font-style: italic; }
.hljs-meta .hljs-string { color: #70CAA9; }
.hljs-keyword, .hljs-template-tag { color: #CA9245; }
.hljs-operator { color: #909E96; }
.hljs-punctuation, .hljs-tag { color: #909E96; }
.hljs-title, .hljs-title.function_, .hljs-title.function_.invoke__, .hljs-attr { color: #F1BF4B; }
.hljs-built_in { color: #F1BF4B; font-style: italic; }
.hljs-string, .hljs-code { color: #70CAA9; }
.hljs-char.escape_ { color: #FAB49C; }
.hljs-regexp { color: #FAB49C; }
.hljs-number { color: #E7877B; }
.hljs-literal, .hljs-symbol, .hljs-variable.constant_, .hljs-formula { color: #E7877B; }
.hljs-title.class_, .hljs-title.class_.inherited__ { color: #549B9F; }
.hljs-type { color: #549B9F; font-style: italic; }
.hljs-variable, .hljs-template-variable, .hljs-subst { color: #D9E1DB; }
.hljs-variable.language_ { color: #E7877B; font-style: italic; }
.hljs-params { color: #C2CBC5; font-style: italic; }
.hljs-property, .hljs-attribute { color: #C2CBC5; }
.hljs-name, .hljs-selector-tag { color: #CA9245; }
.hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #F1BF4B; font-style: italic; }
.hljs-section { color: #F1BF4B; font-weight: bold; }
.hljs-bullet { color: #CA9245; }
.hljs-emphasis { color: #D9E1DB; font-style: italic; }
.hljs-strong { color: #E9EEEC; font-weight: bold; }
.hljs-link { color: #709BC8; text-decoration: underline; }

/* Diffs: a diff line is one token, so it takes green or red_hi on its tint.
   highlight.js marks hunk headers as meta and file headers as comments. */
.hljs-addition { color: #70CAA9; background: #274137; }
.hljs-deletion { color: #E7877B; background: #422E29; }
.language-diff .hljs-meta { color: #709BC8; font-style: normal; }
.language-diff .hljs-comment { color: #E9EEEC; font-style: normal; font-weight: bold; }
paris-catacombes.csssave as styles/highlightjs/paris-catacombes.css
in your site's stylesheets
Download
/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Paris Catacombes for highlight.js */

pre code.hljs { display: block; overflow-x: auto; padding: 1em; }
code.hljs { padding: 3px 5px; }
.hljs-addition, .hljs-deletion { display: inline-block; width: 100%; } /* diff lines as full-width bands */

.hljs { color: #D4DDD7; background: #121E19; }
.hljs::selection, .hljs ::selection { color: #E7ECEA; background: #31433A; }

.hljs-comment { color: #708178; font-style: italic; }
.hljs-quote { color: #A5B1AA; font-style: italic; }
.hljs-doctag, .hljs-meta, .hljs-meta .hljs-keyword { color: #FAB49C; font-style: italic; }
.hljs-meta .hljs-string { color: #70CAA9; }
.hljs-keyword, .hljs-template-tag { color: #CA9245; }
.hljs-operator { color: #8C9A92; }
.hljs-punctuation, .hljs-tag { color: #8C9A92; }
.hljs-title, .hljs-title.function_, .hljs-title.function_.invoke__, .hljs-attr { color: #F1BF4B; }
.hljs-built_in { color: #F1BF4B; font-style: italic; }
.hljs-string, .hljs-code { color: #70CAA9; }
.hljs-char.escape_ { color: #FAB49C; }
.hljs-regexp { color: #FAB49C; }
.hljs-number { color: #E7877B; }
.hljs-literal, .hljs-symbol, .hljs-variable.constant_, .hljs-formula { color: #E7877B; }
.hljs-title.class_, .hljs-title.class_.inherited__ { color: #549B9F; }
.hljs-type { color: #549B9F; font-style: italic; }
.hljs-variable, .hljs-template-variable, .hljs-subst { color: #D4DDD7; }
.hljs-variable.language_ { color: #E7877B; font-style: italic; }
.hljs-params { color: #BFC8C2; font-style: italic; }
.hljs-property, .hljs-attribute { color: #BFC8C2; }
.hljs-name, .hljs-selector-tag { color: #CA9245; }
.hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #F1BF4B; font-style: italic; }
.hljs-section { color: #F1BF4B; font-weight: bold; }
.hljs-bullet { color: #CA9245; }
.hljs-emphasis { color: #D4DDD7; font-style: italic; }
.hljs-strong { color: #E7ECEA; font-weight: bold; }
.hljs-link { color: #709BC8; text-decoration: underline; }

/* Diffs: a diff line is one token, so it takes green or red_hi on its tint.
   highlight.js marks hunk headers as meta and file headers as comments. */
.hljs-addition { color: #70CAA9; background: #20392F; }
.hljs-deletion { color: #E7877B; background: #3B2621; }
.language-diff .hljs-meta { color: #709BC8; font-style: normal; }
.language-diff .hljs-comment { color: #E7ECEA; font-style: normal; font-weight: bold; }
paris-carrelage.csssave as styles/highlightjs/paris-carrelage.css
in your site's stylesheets
Download
/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Paris Carrelage for highlight.js */

pre code.hljs { display: block; overflow-x: auto; padding: 1em; }
code.hljs { padding: 3px 5px; }
.hljs-addition, .hljs-deletion { display: inline-block; width: 100%; } /* diff lines as full-width bands */

.hljs { color: #27342F; background: #EEF2F1; }
.hljs::selection, .hljs ::selection { color: #19221E; background: #B0BFBB; }

.hljs-comment { color: #6C7C76; font-style: italic; }
.hljs-quote { color: #4A5752; font-style: italic; }
.hljs-doctag, .hljs-meta, .hljs-meta .hljs-keyword { color: #B36B51; font-style: italic; }
.hljs-meta .hljs-string { color: #218366; }
.hljs-keyword, .hljs-template-tag { color: #764C00; }
.hljs-operator { color: #56645F; }
.hljs-punctuation, .hljs-tag { color: #56645F; }
.hljs-title, .hljs-title.function_, .hljs-title.function_.invoke__, .hljs-attr { color: #916D07; }
.hljs-built_in { color: #916D07; font-style: italic; }
.hljs-string, .hljs-code { color: #218366; }
.hljs-char.escape_ { color: #B36B51; }
.hljs-regexp { color: #B36B51; }
.hljs-number { color: #AC3B32; }
.hljs-literal, .hljs-symbol, .hljs-variable.constant_, .hljs-formula { color: #AC3B32; }
.hljs-title.class_, .hljs-title.class_.inherited__ { color: #006267; }
.hljs-type { color: #006267; font-style: italic; }
.hljs-variable, .hljs-template-variable, .hljs-subst { color: #27342F; }
.hljs-variable.language_ { color: #AC3B32; font-style: italic; }
.hljs-params { color: #3B4742; font-style: italic; }
.hljs-property, .hljs-attribute { color: #3B4742; }
.hljs-name, .hljs-selector-tag { color: #764C00; }
.hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #916D07; font-style: italic; }
.hljs-section { color: #916D07; font-weight: bold; }
.hljs-bullet { color: #764C00; }
.hljs-emphasis { color: #27342F; font-style: italic; }
.hljs-strong { color: #19221E; font-weight: bold; }
.hljs-link { color: #25629B; text-decoration: underline; }

/* Diffs: a diff line is one token, so it takes green or red_hi on its tint.
   highlight.js marks hunk headers as meta and file headers as comments. */
.hljs-addition { color: #218366; background: #C5DFD7; }
.hljs-deletion { color: #AC3B32; background: #E7D3D2; }
.language-diff .hljs-meta { color: #25629B; font-style: normal; }
.language-diff .hljs-comment { color: #19221E; font-style: normal; font-weight: bold; }

This one is shared by all three flavors.

subway-seat-auto.csssave as styles/highlightjs/subway-seat-auto.css
in your site's stylesheets
Download
/* Subway Seat — generated from palette.py by build.py. Edit the palette, not this file. */
/* Subway Seat for highlight.js, following the system: Subway Seat Enamel when it's light, Subway Seat when it's dark. */

pre code.hljs { display: block; overflow-x: auto; padding: 1em; }
code.hljs { padding: 3px 5px; }
.hljs-addition, .hljs-deletion { display: inline-block; width: 100%; } /* diff lines as full-width bands */

.hljs { color: #3E2C1E; background: #F8EFDF; }
.hljs::selection, .hljs ::selection { color: #2A1D13; background: #CBB898; }

.hljs-comment { color: #8C7254; font-style: italic; }
.hljs-quote { color: #654F3B; font-style: italic; }
.hljs-doctag, .hljs-meta, .hljs-meta .hljs-keyword { color: #843811; font-style: italic; }
.hljs-meta .hljs-string { color: #66740F; }
.hljs-keyword, .hljs-template-tag { color: #A04800; }
.hljs-operator { color: #735C44; }
.hljs-punctuation, .hljs-tag { color: #735C44; }
.hljs-title, .hljs-title.function_, .hljs-title.function_.invoke__, .hljs-attr { color: #976608; }
.hljs-built_in { color: #976608; font-style: italic; }
.hljs-string, .hljs-code { color: #66740F; }
.hljs-char.escape_ { color: #843811; }
.hljs-regexp { color: #843811; }
.hljs-number { color: #BF4233; }
.hljs-literal, .hljs-symbol, .hljs-variable.constant_, .hljs-formula { color: #BF4233; }
.hljs-title.class_, .hljs-title.class_.inherited__ { color: #3E7157; }
.hljs-type { color: #3E7157; font-style: italic; }
.hljs-variable, .hljs-template-variable, .hljs-subst { color: #3E2C1E; }
.hljs-variable.language_ { color: #BF4233; font-style: italic; }
.hljs-params { color: #54402F; font-style: italic; }
.hljs-property, .hljs-attribute { color: #54402F; }
.hljs-name, .hljs-selector-tag { color: #A04800; }
.hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #976608; font-style: italic; }
.hljs-section { color: #976608; font-weight: bold; }
.hljs-bullet { color: #A04800; }
.hljs-emphasis { color: #3E2C1E; font-style: italic; }
.hljs-strong { color: #2A1D13; font-weight: bold; }
.hljs-link { color: #3F6480; text-decoration: underline; }

/* Diffs: a diff line is one token, so it takes green or red_hi on its tint.
   highlight.js marks hunk headers as meta and file headers as comments. */
.hljs-addition { color: #66740F; background: #D7DBC1; }
.hljs-deletion { color: #BF4233; background: #EBD3D1; }
.language-diff .hljs-meta { color: #3F6480; font-style: normal; }
.language-diff .hljs-comment { color: #2A1D13; font-style: normal; font-weight: bold; }

@media (prefers-color-scheme: dark) {
  .hljs { color: #EDDCBC; background: #362619; }
  .hljs::selection, .hljs ::selection { color: #F8ECD4; background: #634932; }

  .hljs-comment { color: #967B5C; font-style: italic; }
  .hljs-quote { color: #C4AE8C; font-style: italic; }
  .hljs-doctag, .hljs-meta, .hljs-meta .hljs-keyword { color: #F4A87E; font-style: italic; }
  .hljs-meta .hljs-string { color: #ADB956; }
  .hljs-keyword, .hljs-template-tag { color: #EC7F31; }
  .hljs-operator { color: #AE9575; }
  .hljs-punctuation, .hljs-tag { color: #AE9575; }
  .hljs-title, .hljs-title.function_, .hljs-title.function_.invoke__, .hljs-attr { color: #F3BF45; }
  .hljs-built_in { color: #F3BF45; font-style: italic; }
  .hljs-string, .hljs-code { color: #ADB956; }
  .hljs-char.escape_ { color: #F4A87E; }
  .hljs-regexp { color: #F4A87E; }
  .hljs-number { color: #FF8373; }
  .hljs-literal, .hljs-symbol, .hljs-variable.constant_, .hljs-formula { color: #FF8373; }
  .hljs-title.class_, .hljs-title.class_.inherited__ { color: #86AD95; }
  .hljs-type { color: #86AD95; font-style: italic; }
  .hljs-variable, .hljs-template-variable, .hljs-subst { color: #EDDCBC; }
  .hljs-variable.language_ { color: #FF8373; font-style: italic; }
  .hljs-params { color: #D9C6A3; font-style: italic; }
  .hljs-property, .hljs-attribute { color: #D9C6A3; }
  .hljs-name, .hljs-selector-tag { color: #EC7F31; }
  .hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #F3BF45; font-style: italic; }
  .hljs-section { color: #F3BF45; font-weight: bold; }
  .hljs-bullet { color: #EC7F31; }
  .hljs-emphasis { color: #EDDCBC; font-style: italic; }
  .hljs-strong { color: #F8ECD4; font-weight: bold; }
  .hljs-link { color: #7F9BAE; text-decoration: underline; }

  /* Diffs: a diff line is one token, so it takes green or red_hi on its tint.
     highlight.js marks hunk headers as meta and file headers as comments. */
  .hljs-addition { color: #ADB956; background: #3F3A1E; }
  .hljs-deletion { color: #FF8373; background: #52281C; }
  .language-diff .hljs-meta { color: #7F9BAE; font-style: normal; }
  .language-diff .hljs-comment { color: #F8ECD4; font-style: normal; font-weight: bold; }
}