Paper Dark Dark
UserCSS.icon
Paper
Paper Dark
code:style.css
body, .app {
--current-project-skin-name: "Paper Dark Dark";
& {
--body-bg: #192f3d;
--brand-icon-y-first-stop-opacity: 0.75;
--brand-icon-x-first-stop-opacity: 0.4;
--navbar-bg: hsl(203deg 38% 22% / 80%);
--navbar-icon-color: #5c96b6;
--navbar-icon-active-color: #5c96b6;
--navbar-icon-hovered-color: #8bc7e8;
--search-form-bg: #395666;
--search-form-icon-color: #fff;
--search-form-icon-focus-color: #444;
--2hop-search-bg: rgba(255, 255, 255, 0.15);
--card-title-color: rgba(255, 255, 255, 0.9);
--card-title-bg: #294252;
--card-bg: #395666;
--card-hover-bg: rgba(0, 0, 0, 0.1);
--card-active-bg: rgba(193, 203, 213, 0.1);
--card-backside: #5c96b6;
--card-description-color: rgba(255, 255, 255, 0.9);
--card-description-link-color: #6bb8ed;
--card-description-code-color: #ccc;
--card-box-shadow-color: rgba(0, 0, 0, 0.2);
--card-box-shadow: 0 2px 0 var(--card-box-shadow-color);
--card-box-hover-shadow: 0 2px 0 var(--card-box-shadow-color);
--card-title-bg-pinned: #294252;
--relation-label-bg: #294252;
--relation-label-text: #fff;
--relation-label-links-bg: #5c96b6;
--relation-label-links-text: #fff;
--relation-label-empty-bg: #fb7476;
--relation-label-empty-text: #fff;
--tool-color: #578eac;
--tool-light-color: #294252;
--tool-badge-bg: #294252;
--tool-bg: #294252;
--tool-text-color: rgba(255, 255, 255, 0.87);
--new-button-vertical-color: #fff;
--new-button-horizontal-color: #fff;
--new-button-bg: #192f3d;
--new-button-hover-bg: #466a7d;
--new-button-active-bg: #395666;
--telomere-border: #4a6e83;
--telomere-unread: #86a8bb;
--telomere-updated: #6bb8ed;
--page-text-color: rgba(255, 255, 255, 0.95);
--page-link-color: #68b3e5;
--page-link-hover-color: #5c96b6;
--page-link-color-cursor-line: #ae8de4;
--page-bg: #395666;
--empty-page-link-color: #fb7476;
--empty-page-link-hover-color: #cf554d;
--line-title-color: rgba(255, 255, 255, 0.95);
--line-permalink-color: rgba(234, 218, 74, 0.35);
--code-color: #ccc;
--code-bg: rgba(0, 0, 0, 0.18);
--page-image-loading-border-color: #888;
--quote-bg-color: rgba(0, 0, 0, 0.2);
--cursor-color: #fff
}
& code.highlight {
color: #ccc
}
& code.highlight .hljs {
display: block;
overflow-x: auto;
padding: .5em;
background: #fdf6e3;
color: #657b83
}
& code.highlight .hljs-comment,
& code.highlight .hljs-quote {
color: #93a1a1
}
& code.highlight .hljs-keyword,
& code.highlight .hljs-selector-tag,
& code.highlight .hljs-addition {
color: #859900
}
& code.highlight .hljs-number,
& code.highlight .hljs-string,
& code.highlight .hljs-meta .hljs-meta-string,
& code.highlight .hljs-literal,
& code.highlight .hljs-doctag,
& code.highlight .hljs-regexp {
color: #2aa198
}
& code.highlight .hljs-title,
& code.highlight .hljs-section,
& code.highlight .hljs-name,
& code.highlight .hljs-selector-id,
& code.highlight .hljs-selector-class {
color: #268bd2
}
& code.highlight .hljs-attribute,
& code.highlight .hljs-attr,
& code.highlight .hljs-variable,
& code.highlight .hljs-template-variable,
& code.highlight .hljs-class .hljs-title,
& code.highlight .hljs-type {
color: #b58900
}
& code.highlight .hljs-symbol,
& code.highlight .hljs-bullet,
& code.highlight .hljs-subst,
& code.highlight .hljs-meta,
& code.highlight .hljs-meta .hljs-keyword,
& code.highlight .hljs-selector-attr,
& code.highlight .hljs-selector-pseudo,
& code.highlight .hljs-link {
color: #cb4b16
}
& code.highlight .hljs-built_in,
& code.highlight .hljs-deletion {
color: #dc322f
}
& code.highlight .hljs-strong {
font-weight: bold
}
}
#ダークテーマ
#UserCSS