MediaWiki:DarkTheme.css

/* Color adjust for dark theme */
:root {
    --color-base: white;
    --background-color-interactive-subtle: #371111cf;
    --background-color-neutral-subtle: #371111cf;
    --background-color-base: #181313cf;
    --background-color-neutral: #37373785;
    --background-color-interactive: #37373785;
    --background-color-progressive-subtle: #37373785;
    --color-base--hover: white;
    --color-progressive: white;
    --border-color-base: #37131399;
    --border-color-subtle: #37131399;
    --border-color-muted: #37131399;
    --background-color-warning-subtle: #6f2d2d7a;
    --border-color-warning: #982727a8;
    --color-notice: #f09f9f;
}

/* Icon fix (black > white) */
.vector-menu-dropdown .vector-menu-heading::after,
.wikiEditor-ui-toolbar .group .tool-select .label::after {
    filter: contrast(0) brightness(10);
}
.searchButton[name='go'] {
    filter: contrast(0) brightness(10);
}

/* Text Area */
.wikiEditor-ui-toolbar {
    background-color: #3b2222cf;
    box-shadow: 0 2px 1px 0 rgba(0, 0, 0, 0.1);
}

.tool-button, .tool.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button {
    filter: contrast(0) brightness(10);
}

.wikiEditor-ui-toolbar .tabs span.tab a::before {
    filter: contrast(0) brightness(10);
}

textarea {
    background-color: #37373785;
    color: white;
}

/* Header */
#mw-page-base {
    background-color: #252525;
    background-image: linear-gradient(to bottom, var(--background-color-base, #211a1a) 50%, #252525 100%);
    background-position: bottom left;
    height: 5em;
}

/* Side Panel */
body {
    background-color: #252525;
}

.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a:visited {
    color: #d93c3c;
}
.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a {
    color: #e76b6b;
}

/* Searchbar */
.vector-search-box-input {
    background-color: rgb(57 56 56 / 50%);
    color: #dfe0e1;
    border: 1px solid #891b1b;
}



/* Main Body */
.mw-body, .parsoid-body {
    background-color: var(--background-color-base, #252525);
    color: var(--color-base, #d1d1d1);
    direction: ltr;
    padding: 1em;
}

.mw-body {
    border: 1px solid #790f0f;
}

/* Header Text */
.mw-heading, h1, h2, h3, h4, h5, h6 {
    color: var(--color-emphasized, #b90009);
    font-weight: bold;
    margin: 0;
    padding-top: 0.5em;
    padding-bottom: 0.17em;
    display: flow-root;
    word-break: break-word;
}

/* New Links */
a.new {
    color: #48b8db;
}
a.new:after {
    content: '';
    background-image: url(/resources/assets/link_new.png);
    background-position: center right;
    background-repeat: no-repeat;
    background-size: 0.67em;
    padding-right: 1em;
    background-position-x: 2px;
    background-position-y: 0px;
}

/* Gallery Item */
li.gallerybox div.thumb {
    background-color: #510d0d57;
    border: 1px solid #4d1c1c;
}

/* Header Nav */
.vector-menu-tabs-legacy li {
    background-image: linear-gradient(to top, #9f4242 0, #4b060638 1px, #e5777714 100%);
}

.vector-menu-tabs, .vector-menu-tabs a, #mw-head .vector-menu-dropdown .vector-menu-heading {
    background-image: linear-gradient(to bottom, rgb(167 215 249 / 0%) 0, #9f4242 100%);
}

.vector-menu-tabs-legacy .selected {
	background: none;
    background-image: linear-gradient(to top, #ff0505 0, #9b1c1c94 1px, #fbe6e614 100%);
}

.vector-menu-tabs-legacy .selected a, .vector-menu-tabs-legacy .selected a:visited {
    color: #ffffff;
    text-decoration: none;
}

.vector-menu-tabs-legacy li a {
    color: #7badff;
}

.vector-menu-dropdown .vector-menu-heading {
    color: #acc7dd;
}

.vector-menu-dropdown .vector-menu-content {
    background-color: var(--background-color-base, #373434cf);
    border: 1px solid var(--border-color-base, #37131399);
    backdrop-filter: blur(10px);
}

.suggestions-results {
    background-color: #37343475;
    border: 1px solid var(--border-color-base, #37131399);
    backdrop-filter: blur(10px);
}

.suggestions-result {
	color: #d5d5d5;
}

.vector-menu-dropdown .mw-list-item a {
    color: #99bfff;
}

.suggestions-special {
    border: 1px solid #5d2424;
    backdrop-filter: blur(10px);
    background-color: var(--background-color-base, #373434cf);
}

.suggestions-special .special-label {
    color: #b97d7d;
    text-align: left;
}

.suggestions-special .special-query {
    color: #ffffff;
    font-style: italic;
    text-align: left;
}

/* <pre> */
.mw-content-ltr.mw-highlight-lines pre, .mw-content-ltr.content .mw-highlight-lines pre {
    box-shadow: inset 2.75em 0 0 #391b1b;
    background-color: rgb(75 75 75);
    color: #ade8ff;
}

pre, code, .mw-code {
    background-color: #1a1a1a;
    color: #8fbae5;
    border: 1px solid var(--border-color-muted, #8f2f2f);
}

/* TOC */
.toctogglelabel {
    color: #60b3ef;
    cursor: pointer;
}

/* Footer links */
.catlinks {
    background-color: #1a1a1a;
}

/* Infobox link color */
.mw-parser-output a.extiw:visited, .mw-parser-output a.external:visited {
    color: #79d9ff;
}