A Tokyo Night theme for GitHub, based on the Tokyo Night VSCode theme.
Github Tokyo Night by fun840
Details
Authorfun840
LicenseNo License
Categorygithub.com
Created
Updated
Size5.7 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
/* ==UserStyle==
@name Github Tokyo Night
@namespace USO Archive
@version 20220403.13.33
@description "A Tokyo Night theme for GitHub, based on the <a href=\"https://github.com/enkia/tokyo-night-vscode-theme\">Tokyo Night VSCode theme</a>. It's not perfect, and the editor doesn't support as advanced syntax highlighting as VSCode, but it still looks pretty good."
@author fun840 .
@license NO-REDISTRIBUTION==/UserStyle== */
@-moz-document domain("github.com") {
* {
/* background colors */
--color-canvas-default: #1A1B26;
--color-canvas-inset: #16161E;
--color-page-header-bg: #1A1B26;
--color-header-bg: #1A1B26;
--color-canvas-subtle: #1E202E;
/* borders */
--color-border-default: #101014;
--color-border-muted: #101014;
/* #585B74 */
--color-topic-tag-border: #101014;
--color-primer-border-active: #3D59A1;
/* text color */
--color-fg-default: #A9B1D6;
--color-accent-fg: #7BC5E4;
--color-fg-muted: #787C99;
--color-header-logo: #C0CAF5;
--color-header-text: #F0F0FF;
/* buttons */
--color-btn-text: #7BC5E4;
--color-btn-outline-text: #7BC5E4;
--color-btn-bg: #1E202E;
--color-btn-outline-bg: #1E202E;
--color-btn-border: #101014;
--color-btn-outline-border: #101014;
--color-btn-hover-text: #61CCFA;
--color-btn-outline-hover-text: #61CCFA;
--color-btn-outline-hover-bg: #32354d;
--color-btn-hover-bg: #32354d;
--color-btn-hover-border: #101014;
--color-btn-outline-hover-border: #101014;
--color-btn-primary-bg: #73994B;
--color-btn-primary-hover-bg: #82C13E;
/* specific colors */
--color-success-fg: #9ECE6A;
--color-success-emphasis: #93cf53;
--color-danger-fg: #F7768E;
--color-danger-emphasis: #FB748D;
--color-done-emphasis: #BB9AF7;
--color-accent-subtle: #1E202E;
--color-accent-emphasis: #444B6A;
--color-accent-muted: #32354d;
--color-fg-on-emphasis: #9ABDF5;
--color-sponsors-fg: #F7768E;
--color-header-search-bg: #14141B;
--color-header-search-border: #1A1A24;
--color-diff-blob-hunk-num-bg: #24283b;
/* actual code */
--color-diffstat-addition-bg: #9ECE6A;
--color-diff-blob-addition-line-bg: #1D2631;
--color-diff-blob-addition-num-bg: #20303B;
--color-diff-blob-deletion-line-bg: #34212A;
--color-diff-blob-deletion-num-bg: #4A262E;
/* shadows */
--color-shadow-medium: 0px 0px 5px 3px #14141B;
/* not variables */
font-family: "Rec Mono Linear", mono;
}
.Box,
.Box-Body {
border-radius: 15px;
}
.Box-header {
border-radius: 15px 15px 0px 0px;
}
.rounded-top-2 {
/* border-radius: 15px; */
background-color: #1E202E !important;
}
.Details-content--hidden-not-important.js-navigation-container {
border-radius: 0px 0px 15px 15px;
}
/*
#readme {
border-radius: 15px;
background-color: #00ff00;
}
readme-toc {
border-radius: 15px;
}
*/
.UnderlineNav-item,
.UnderlineNav-octicon {
color: #787C99;
}
/* markdown */
.markdown-body h1,
.markdown-body h2 {
border-bottom: 1px solid #585B74 !important;
}
/* tag text */
.State {
color: var(--color-canvas-default);
}
/* octicons */
.footer-octicon {
color: #787C99;
}
.footer-octicon:hover {
color: #9397AE;
}
.octicon-eye {
fill: #BB9AF7;
}
.octicon-eye:hover {
transform: scale(1.1);
}
.octicon-star {
fill: #E0AF68;
}
.octicon-star:hover {
transform: scale(1.1);
}
.octicon-repo-forked {
fill: #73DACA;
}
.octicon-repo-forked:hover {
transform: scale(1.1);
}
.octicon-check {
fill: #9ECE6A;
}
.octicon-git-branch {
fill: #7BC5E4;
}
.octicon-tag {
fill: #E0AF68;
}
.octicon-tag.color-fg-success {
fill: var(--color-success-fg);
}
.octicon-history {
fill: #7AA2F7;
}
.octicon-issue-opened.open,
.octicon-git-pull-request.open {
fill: #9ECE6A;
}
.octicon-git-merge.open,
.octicon-issue-closed {
fill: #BB9AF7;
}
.octicon-git-pull-request-closed {
fill: #F7768E;
}
.State .octicon-issue-closed {
fill: var(--color-fg-on-emphasis) !important;
}
* {
--color-canvas-default: #1A1B26;
--color-canvas-inset: #16161E;
--color-page-header-bg: #1A1B26;
}
body {
background-color: #16161E;
}
/* code */
.Box-body {
background-color: var(--color-canvas-default);
}
.blob-num {
color: #363B54;
}
* {
--code-red: #f7768e;
--code-orange: #ff9e64;
--code-yellow: #e0af68;
--code-green: #9ece6a;
--code-cyan: #73daca;
--code-cyan-2: #7dcfff;
--code-blue: #7aa2f7;
--code-purple: #bb9af7;
--code-default: #a9b1d6;
--code-default-2: #9aa5ce;
--code-dim: #565f89;
--code-dim-2: #363B54;
}
.pl-k {
color: var(--code-purple);
}
.pl-v, .pl-s1, .pl-kos {
color: var(--code-default);
}
.pl-c {
color: var(--code-dim);
}
.pl-smi {
color: var(--code-red);
}
.pl-c1, .pl-s {
color: var(--code-cyan-2);
}
.pl-en {
color: var(--code-blue);
}
/* editor */
.CodeMirror, .CodeMirror-lines, .CodeMirror-gutter {
background-color: var(--color-canvas-default) !important;
}
.CodeMirror-linenumber {
color: var(--code-dim-2) !important;
}
.cm-keyword {
color: var(--code-purple) !important;
}
/* end code stuff */
.intro-shelf {
background-image: linear-gradient(180deg, var(--color-canvas-default-transparent), var(--color-canvas-default)),linear-gradient(70deg, var(--color-accent-subtle) 32%, #24283B);
}
}
@-moz-document regexp("https?://.*github.com/.+") {
* {
--color-canvas-default: #1A1B26;
--color-canvas-inset: #16161E;
--color-page-header-bg: #1A1B26;
}
body {
background-color: #16161E;
}
}