Explore

github.com

Github Neutral (VSCode syntax)

by @956MB(Alexander Bays)Created New

  • Custom CSS

2 downloads

Screenshot of Github Neutral (VSCode syntax) on github.com

About this boost

Swaps GitHub's blue-tinted dark theme for neutral greys. Code is highlighted with VSCode's default dark theme colours.

By Alexander Bays (@956MB). Imported from https://github.com/956MB/boosts under the MIT License.

What this boost changes

  • Custom CSS

    Adds 308 lines of its own CSS. Rules that would load files from the internet are rejected when a boost is submitted.

    ShowHide 308 lines · 15.1 KB
    /*
 * From https://github.com/956MB/boosts
 *
 * MIT License
 *
 * Copyright (c) 2026 Alexander Bays
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in all
 * copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 * SOFTWARE.
 */

/* Github Neutral (VSCode syntax) */
/* https://github.com/956MB/boosts/blob/main/github-neutral-vscode-syntax.css */

/* https://*.github.com/ */

[data-color-mode="dark"][data-dark-theme*="dark"] {
	--page-header-bgColor: #121212 !important;
	--topicTag-borderColor: #00000000 !important;
	--highlight-neutral-bgColor: #b2b2b266 !important;
	--codeMirror-fgColor: #f2f2f2 !important;
	--codeMirror-bgColor: #111111 !important;
	--codeMirror-gutters-bgColor: #111111 !important;
	--codeMirror-gutterMarker-fgColor-default: #111111 !important;
	--codeMirror-gutterMarker-fgColor-muted: #959595 !important;
	--codeMirror-lineNumber-fgColor: #959595 !important;
	--codeMirror-cursor-fgColor: #f2f2f2 !important;
	--codeMirror-selection-bgColor: #8d8d8d66 !important;
	--codeMirror-activeline-bgColor: #6b6b6b33 !important;
	--codeMirror-matchingBracket-fgColor: #f2f2f2 !important;
	--codeMirror-lines-bgColor: #111111 !important;
	--codeMirror-syntax-fgColor-comment: #6b6b6b !important;
	--codeMirror-syntax-fgColor-constant: #dcdcaa !important;
	--codeMirror-syntax-fgColor-entity: #dcdcaa !important;
	--codeMirror-syntax-fgColor-keyword: #c586c0 !important;
	--codeMirror-syntax-fgColor-storage: #4ec9b0 !important;
	--codeMirror-syntax-fgColor-string: #ce9178 !important;
	--codeMirror-syntax-fgColor-support: #79c0ff !important;
	--codeMirror-syntax-fgColor-variable: #4ec9b0 !important;
	--color-prettylights-syntax-comment: #6b6b6b !important;
	--color-prettylights-syntax-constant: #dcdcaa !important;
	--color-prettylights-syntax-constant-other-reference-link: #dcdcaa !important;
	--color-prettylights-syntax-entity: #79c0ff !important;
	--color-prettylights-syntax-storage-modifier-import: #4ec9b0 !important;
	--color-prettylights-syntax-entity-tag: #79c0ff !important;
	--color-prettylights-syntax-keyword: #c586c0 !important;
	--color-prettylights-syntax-string: #ce9178 !important;
	--color-prettylights-syntax-variable: #4ec9b0 !important;
	--contribution-default-bgColor-0: #181818 !important;
	--header-fgColor-logo: #f2f2f2 !important;
	--header-bgColor: #1a1a1af2 !important;
	--header-borderColor-divider: #6b6b6b !important;
	--headerSearch-bgColor: #111111 !important;
	--headerSearch-borderColor: #313131 !important;
	--data-blue-color-muted: #080808 !important;
	--data-gray-color-emphasis: #5c5c5c !important;
	--data-gray-color-muted: #1c1c1c !important;
	--display-blue-bgColor-muted: #080808 !important;
	--display-blue-borderColor-muted: #0b0b0b !important;
	--display-gray-bgColor-muted: #1c1c1c !important;
	--display-gray-bgColor-emphasis: #5c5c5c !important;
	--display-gray-fgColor: #9a9a9a !important;
	--display-gray-borderColor-muted: #2b2b2b !important;
	--display-gray-borderColor-emphasis: #747474 !important;
	--display-cyan-bgColor-muted: #0a0a0a !important;
	--display-cyan-borderColor-muted: #111111 !important;
	--display-indigo-bgColor-muted: #1a1a1a !important;
	--display-indigo-borderColor-muted: #242424 !important;
	--avatar-shadow: 0px 0px 0px 2px #111111 !important;
	--avatarStack-fade-bgColor-default: #424242 !important;
	--avatarStack-fade-bgColor-muted: #2f2f2f !important;
	--color-calendar-graph-day-bg: #1c1c1c !important;
	--control-bgColor-rest: #242424 !important;
	--control-bgColor-hover: #292929 !important;
	--control-bgColor-active: #2f2f2f !important;
	--control-bgColor-disabled: #242424 !important;
	--control-bgColor-selected: #242424 !important;
	--control-fgColor-rest: #f2f2f2 !important;
	--control-fgColor-placeholder: #959595 !important;
	--control-fgColor-disabled: #6b6b6b99 !important;
	--control-borderColor-rest: #424242 !important;
	--control-borderColor-emphasis: #6b6b6b !important;
	--control-borderColor-disabled: #6b6b6b1a !important;
	--control-borderColor-selected: #f2f2f2 !important;
	--control-iconColor-rest: #959595 !important;
	--control-transparent-bgColor-rest: #00000000 !important;
	--control-transparent-bgColor-hover: #6b6b6b33 !important;
	--control-transparent-bgColor-active: #6b6b6b40 !important;
	--control-transparent-bgColor-disabled: #242424 !important;
	--control-transparent-bgColor-selected: #6b6b6b1a !important;
	--control-transparent-borderColor-rest: #00000000 !important;
	--control-transparent-borderColor-hover: #00000000 !important;
	--control-transparent-borderColor-active: #00000000 !important;
	--control-checked-bgColor-disabled: #6b6b6b99 !important;
	--control-checked-fgColor-disabled: #030303 !important;
	--control-checked-borderColor-disabled: #6b6b6b99 !important;
	--controlTrack-bgColor-rest: #292929 !important;
	--controlTrack-bgColor-hover: #2f2f2f !important;
	--controlTrack-bgColor-active: #353535 !important;
	--controlTrack-bgColor-disabled: #6b6b6b99 !important;
	--controlTrack-fgColor-rest: #959595 !important;
	--controlTrack-borderColor-rest: #424242 !important;
	--controlTrack-borderColor-disabled: #6b6b6b99 !important;
	--controlKnob-bgColor-rest: #030303 !important;
	--controlKnob-bgColor-disabled: #242424 !important;
	--controlKnob-borderColor-rest: #6b6b6b !important;
	--controlKnob-borderColor-disabled: #242424 !important;
	--counter-borderColor: #00000000 !important;
	--counter-bgColor-muted: #6b6b6b33 !important;
	--counter-bgColor-emphasis: #6b6b6b !important;
	--button-danger-bgColor-rest: #292929 !important;
	--button-danger-bgColor-disabled: #292929 !important;
	--button-danger-borderColor-rest: #454545 !important;
	--button-default-fgColor-rest: #f2f2f2 !important;
	--button-default-bgColor-rest: #242424 !important;
	--button-default-bgColor-hover: #292929 !important;
	--button-default-bgColor-active: #2f2f2f !important;
	--button-default-bgColor-selected: #2f2f2f !important;
	--button-default-bgColor-disabled: #242424 !important;
	--button-default-borderColor-rest: #424242 !important;
	--button-default-borderColor-hover: #424242 !important;
	--button-default-borderColor-active: #424242 !important;
	--button-default-borderColor-disabled: #6b6b6b1a !important;
	--button-invisible-fgColor-rest: #f2f2f2 !important;
	--button-invisible-fgColor-hover: #f2f2f2 !important;
	--button-invisible-fgColor-disabled: #6b6b6b99 !important;
	--button-invisible-iconColor-rest: #959595 !important;
	--button-invisible-iconColor-hover: #959595 !important;
	--button-invisible-iconColor-disabled: #6b6b6b99 !important;
	--button-invisible-bgColor-rest: #00000000 !important;
	--button-invisible-bgColor-hover: #6b6b6b33 !important;
	--button-invisible-bgColor-active: #6b6b6b40 !important;
	--button-invisible-bgColor-disabled: #242424 !important;
	--button-invisible-borderColor-rest: #00000000 !important;
	--button-invisible-borderColor-hover: #00000000 !important;
	--button-invisible-borderColor-disabled: #6b6b6b1a !important;
	--button-outline-fgColor-disabled: #87878780 !important;
	--button-outline-bgColor-rest: #f2f2f2 !important;
	--button-outline-bgColor-hover: #292929 !important;
	--button-outline-bgColor-active: #191919 !important;
	--button-outline-bgColor-disabled: #242424 !important;
	--button-outline-borderColor-hover: #424242 !important;
	--button-outline-borderColor-selected: #424242 !important;
	--button-inactive-fgColor: #959595 !important;
	--button-inactive-bgColor: #292929 !important;
	--buttonCounter-default-bgColor-rest: #353535 !important;
	--buttonCounter-invisible-bgColor-rest: #6b6b6b33 !important;
	--buttonCounter-outline-bgColor-rest: #0f0f0f33 !important;
	--buttonCounter-outline-bgColor-hover: #0f0f0f33 !important;
	--buttonCounter-outline-bgColor-disabled: #3434340d !important;
	--buttonCounter-outline-fgColor-disabled: #87878780 !important;
	--reactionButton-selected-bgColor-rest: #8d8d8d33 !important;
	--reactionButton-selected-bgColor-hover: #8e8e8e5c !important;
	--menu-bgColor-active: #1a1a1a !important;
	--overlay-bgColor: #1a1a1a !important;
	--overlay-borderColor: #424242b3 !important;
	--overlay-backdrop-bgColor: #24242466 !important;
	--selectMenu-borderColor: #424242 !important;
	--selectMenu-bgColor-active: #0f0f0f !important;
	--sideNav-bgColor-selected: #242424 !important;
	--skeletonLoader-bgColor: #1a1a1a !important;
	--timelineBadge-bgColor: #242424 !important;
	--treeViewItem-leadingVisual-iconColor-rest: #959595 !important;
	--underlineNav-borderColor-active: #4493f8 !important;
	--underlineNav-borderColor-hover: #d0d0d0b3 !important;
	--underlineNav-iconColor-rest: #666666 !important;
	--card-bgColor: #1a1a1a !important;
	--label-gray-bgColor-rest: #1c1c1c !important;
	--label-gray-bgColor-hover: #2b2b2b !important;
	--label-gray-bgColor-active: #3c3c3c !important;
	--label-gray-fgColor-rest: #9a9a9a !important;
	--label-gray-fgColor-hover: #a3a3a3 !important;
	--label-gray-fgColor-active: #bababa !important;
	--tooltip-bgColor: #424242 !important;
	--fgColor-default: #f2f2f2 !important;
	--fgColor-muted: #959595 !important;
	--fgColor-onInverse: #030303 !important;
	--fgColor-black: #030303 !important;
	--fgColor-disabled: #6b6b6b99 !important;
	--fgColor-neutral: #959595 !important;
	--fgColor-closed: #959595 !important;
	--bgColor-default: #111111 !important; /* maybe use #181818 */
	--bgColor-muted: #1a1a1a !important;
	--bgColor-inset: #030303 !important;
	--bgColor-emphasis: #424242 !important;
	--bgColor-black: #030303 !important;
	--bgColor-disabled: #242424 !important;
	--bgColor-transparent: #00000000 !important;
	--bgColor-neutral-muted: #6b6b6b33 !important;
	--bgColor-neutral-emphasis: #6b6b6b !important;
	--bgColor-accent-muted: #8d8d8d1a !important;
	--bgColor-closed-muted: #6b6b6b1a !important;
	--bgColor-closed-emphasis: #6b6b6b !important;
	--borderColor-default: #424242 !important;
	--borderColor-muted: #424242b3 !important;
	--borderColor-emphasis: #6b6b6b !important;
	--borderColor-disabled: #6b6b6b1a !important;
	--borderColor-transparent: #00000000 !important;
	--borderColor-neutral-muted: #424242b3 !important;
	--borderColor-neutral-emphasis: #6b6b6b !important;
	--borderColor-accent-muted: #8d8d8d66 !important;
	--borderColor-closed-muted: #42424266 !important;
	--borderColor-closed-emphasis: #6b6b6b !important;
	--color-ansi-black: #353535 !important;
	--color-ansi-black-bright: #6b6b6b !important;
	--color-ansi-white: #f2f2f2 !important;
	--color-ansi-gray: #6b6b6b !important;
	--diffBlob-additionNum-bgColor: #58ff664d !important;
	--diffBlob-additionLine-bgColor: #38fd5926 !important;
	--diffBlob-hunkNum-bgColor-rest: #383839 !important;
	--diffBlob-expander-iconColor: #999999 !important;
	--diffBlob-additionWord-bgColor: #66fd3866 !important;
	--shadow-inset: inset 0px 1px 0px 0px #0303033d !important;
	--shadow-resting-xsmall: 0px 1px 0px 0px #030303cc !important;
	--shadow-resting-small: 0px 1px 0px 0px #03030366 !important;
	--shadow-resting-medium: 0px 3px 6px 0px #030303cc !important;
	--shadow-floating-small: 0px 0px 0px 1px #424242,
		0px 6px 12px -3px #03030366, 0px 6px 18px 0px #03030366 !important;
	--shadow-floating-medium: 0px 0px 0px 1px #424242,
		0px 8px 16px -4px #03030366, 0px 4px 32px -4px #03030366,
		0px 24px 48px -12px #03030366, 0px 48px 96px -24px #03030366 !important;
	--shadow-floating-large: 0px 0px 0px 1px #424242, 0px 24px 48px 0px #030303 !important;
	--shadow-floating-xlarge: 0px 0px 0px 1px #424242, 0px 32px 64px 0px #030303 !important;
	--shadow-floating-legacy: 0px 6px 12px -3px #03030366,
		0px 6px 18px 0px #03030366 !important;
	--color-canvas-default: #111111 !important;
	--color-canvas-overlay: #1c1c1c !important;
	--color-canvas-inset: #050505 !important;
	--color-canvas-subtle: #1c1c1c !important;
	--color-border-default: #353535 !important;
	--color-border-muted: #262626 !important;
	--color-border-subtle: rgba(245, 245, 245, 0.1) !important;
	--color-shadow-small: 0 0 transparent !important;
	--color-shadow-medium: 0 3px 6px #050505 !important;
	--color-shadow-large: 0 8px 24px #050505 !important;
	--color-shadow-extra-large: 0 12px 48px #050505 !important;
	--color-neutral-emphasis-plus: #737373 !important;
	--color-neutral-emphasis: #737373 !important;
	--color-neutral-muted: rgba(115, 115, 115, 0.4) !important;
	--color-neutral-subtle: rgba(115, 115, 115, 0.1) !important;
	--color-accent-muted: rgba(128, 128, 128, 0.4) !important;
	--color-accent-subtle: rgba(128, 128, 128, 0.1) !important;
	--color-success-muted: rgba(128, 128, 128, 0.4) !important;
	--color-success-subtle: rgba(128, 128, 128, 0.15) !important;
	--color-attention-muted: rgba(128, 128, 128, 0.4) !important;
	--color-attention-subtle: rgba(128, 128, 128, 0.15) !important;
	--color-severe-muted: rgba(128, 128, 128, 0.4) !important;
	--color-severe-subtle: rgba(128, 128, 128, 0.1) !important;
	--color-danger-muted: rgba(128, 128, 128, 0.4) !important;
	--color-danger-subtle: rgba(128, 128, 128, 0.1) !important;
	--color-open-muted: rgba(128, 128, 128, 0.4) !important;
	--color-open-subtle: rgba(128, 128, 128, 0.15) !important;
	--color-closed-muted: rgba(128, 128, 128, 0.4) !important;
	--color-closed-subtle: rgba(128, 128, 128, 0.15) !important;
	--color-done-muted: rgba(128, 128, 128, 0.4) !important;
	--color-done-subtle: rgba(128, 128, 128, 0.1) !important;
	--color-sponsors-muted: rgba(128, 128, 128, 0.4) !important;
	--color-sponsors-subtle: rgba(128, 128, 128, 0.1) !important;
	--color-primer-canvas-backdrop: rgba(5, 5, 5, 0.8) !important;
	--color-primer-canvas-sticky: rgba(17, 17, 17, 0.95) !important;
	--color-primer-border-contrast: hsla(0, 0%, 100%, 0.2) !important;
	--color-primer-shadow-highlight: 0 0 transparent !important;
	--color-primer-shadow-inset: 0 0 transparent !important;
	--color-scale-black: #050505 !important;
	--color-scale-gray-0: #f5f5f5 !important;
	--color-scale-gray-1: #d0d0d0 !important;
	--color-scale-gray-2: #b8b8b8 !important;
	--color-scale-gray-3: #909090 !important;
	--color-scale-gray-4: #737373 !important;
	--color-scale-gray-5: #4d4d4d !important;
	--color-scale-gray-6: #353535 !important;
	--color-scale-gray-7: #262626 !important;
	--color-scale-gray-8: #1c1c1c !important;
	--color-scale-gray-9: #111111 !important;
}

.markdown-body hr {
	height: 1px !important;
	background-color: var(
		--borderColor-muted,
		var(--color-border-muted)
	) !important;
}

.durGbC,
.eBevHz {
	box-shadow: none !important;
}

.IssueTypeToken-module__token--iQHKj[data-color="blue" i] {
	background: #131d2e !important;
	border-color: #234981 !important;
}

Something wrong with this boost? Sign in to report it.

See github.com