A Tokyo Night theme for GitHub, based on the Tokyo Night VSCode theme. Updated some tiny things
Github Tokyo Night (not all mono) by zedevs
Details
Authorzedevs
LicenseNONE
Categorygithub.com
Created
Updated
Size6.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
@author fun840 .
@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.
@version 20220403.13.33
@license NONE
@preprocessor uso
==/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: "Nimbus Sans";
font-weight: 500;
}
.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;
}
.blob-code-content *, .file-box * , .blob-code-inner {
font-size: 16px;
line-height: 1.4;
font-family: "FiraCode Nerd Font Mono Ret", mono !important;
}
* {
--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;
}
}