From a1394d9e107e4a2136fac3711899154aace15054 Mon Sep 17 00:00:00 2001
From: EnixCoda <enixcoda@gmail.com>
Date: Sat, 3 Apr 2021 09:51:45 +0800
Subject: [PATCH] feat: support color mode - dark dimmed

---
 src/styles/darkDimmed/variables.scss | 680 +++++++++++++++++++++++++++
 src/styles/themes.scss               |  31 +-
 2 files changed, 702 insertions(+), 9 deletions(-)
 create mode 100644 src/styles/darkDimmed/variables.scss

diff --git a/src/styles/darkDimmed/variables.scss b/src/styles/darkDimmed/variables.scss
new file mode 100644
index 0000000..6b46bd4
--- /dev/null
+++ b/src/styles/darkDimmed/variables.scss
@@ -0,0 +1,680 @@
+$variables: (
+  'auto-black': '#cdd9e5',
+  'auto-white': '#1c2128',
+  'auto-gray-0': '#22272e',
+  'auto-gray-1': '#2d333b',
+  'auto-gray-2': '#373e47',
+  'auto-gray-3': '#444c56',
+  'auto-gray-4': '#545d68',
+  'auto-gray-5': '#636e7b',
+  'auto-gray-6': '#768390',
+  'auto-gray-7': '#909dab',
+  'auto-gray-8': '#adbac7',
+  'auto-gray-9': '#cdd9e5',
+  'auto-blue-0': '#0f2d5c',
+  'auto-blue-1': '#143d79',
+  'auto-blue-2': '#1b4b91',
+  'auto-blue-3': '#255ab2',
+  'auto-blue-4': '#316dca',
+  'auto-blue-5': '#4184e4',
+  'auto-blue-6': '#539bf5',
+  'auto-blue-7': '#6cb6ff',
+  'auto-blue-8': '#96d0ff',
+  'auto-blue-9': '#c6e6ff',
+  'auto-green-0': '#113417',
+  'auto-green-1': '#1b4721',
+  'auto-green-2': '#245829',
+  'auto-green-3': '#2b6a30',
+  'auto-green-4': '#347d39',
+  'auto-green-5': '#46954a',
+  'auto-green-6': '#57ab5a',
+  'auto-green-7': '#6bc46d',
+  'auto-green-8': '#8ddb8c',
+  'auto-green-9': '#b4f1b4',
+  'auto-yellow-0': '#452700',
+  'auto-yellow-1': '#593600',
+  'auto-yellow-2': '#6c4400',
+  'auto-yellow-3': '#805400',
+  'auto-yellow-4': '#966600',
+  'auto-yellow-5': '#ae7c14',
+  'auto-yellow-6': '#c69026',
+  'auto-yellow-7': '#daaa3f',
+  'auto-yellow-8': '#eac55f',
+  'auto-yellow-9': '#fbe090',
+  'auto-orange-0': '#4d210c',
+  'auto-orange-1': '#682d0f',
+  'auto-orange-2': '#7f3913',
+  'auto-orange-3': '#94471b',
+  'auto-orange-4': '#ae5622',
+  'auto-orange-5': '#cc6b2c',
+  'auto-orange-6': '#e0823d',
+  'auto-orange-7': '#f69d50',
+  'auto-orange-8': '#ffbc6f',
+  'auto-orange-9': '#ffddb0',
+  'auto-red-0': '#78191b',
+  'auto-red-1': '#78191b',
+  'auto-red-2': '#922323',
+  'auto-red-3': '#ad2e2c',
+  'auto-red-4': '#c93c37',
+  'auto-red-5': '#e5534b',
+  'auto-red-6': '#f47067',
+  'auto-red-7': '#ff938a',
+  'auto-red-8': '#ffb8b0',
+  'auto-red-9': '#ffd8d3',
+  'auto-purple-0': '#352160',
+  'auto-purple-1': '#472c82',
+  'auto-purple-2': '#5936a2',
+  'auto-purple-3': '#6b44bc',
+  'auto-purple-4': '#8256d0',
+  'auto-purple-5': '#986ee2',
+  'auto-purple-6': '#b083f0',
+  'auto-purple-7': '#dcbdfb',
+  'auto-purple-8': '#dcbdfb',
+  'auto-purple-9': '#eedcff',
+  'auto-pink-0': '#551639',
+  'auto-pink-1': '#69264a',
+  'auto-pink-2': '#7e325a',
+  'auto-pink-3': '#983b6e',
+  'auto-pink-4': '#ae4c82',
+  'auto-pink-5': '#c96198',
+  'auto-pink-6': '#e275ad',
+  'auto-pink-7': '#fc8dc7',
+  'auto-pink-8': '#ffb3d8',
+  'auto-pink-9': '#ffd7eb',
+  'text-primary': '#adbac7',
+  'text-secondary': '#768390',
+  'text-tertiary': '#768390',
+  'text-placeholder': '#545d68',
+  'text-disabled': '#545d68',
+  'text-inverse': '#22272e',
+  'text-link': '#539bf5',
+  'text-danger': '#e5534b',
+  'text-success': '#6bc46d',
+  'text-warning': '#daaa3f',
+  'text-white': '#cdd9e5',
+  'icon-primary': '#adbac7',
+  'icon-secondary': '#636e7b',
+  'icon-tertiary': '#545d68',
+  'icon-info': '#6cb6ff',
+  'icon-danger': '#e5534b',
+  'icon-success': '#6bc46d',
+  'icon-warning': '#daaa3f',
+  'border-primary': '#444c56',
+  'border-secondary': '#373e47',
+  'border-tertiary': '#636e7b',
+  'border-overlay': '#444c56',
+  'border-inverse': '#cdd9e5',
+  'border-info': '#4184e466',
+  'border-danger': '#e5534b66',
+  'border-success': '#57ab5a66',
+  'border-warning': '#ae7c1466',
+  'bg-canvas': '#22272e',
+  'bg-canvas-mobile': '#1c2128',
+  'bg-canvas-inverse': '#cdd9e5',
+  'bg-canvas-inset': '#1e2228',
+  'bg-primary': '#22272e',
+  'bg-secondary': '#22272e',
+  'bg-tertiary': '#2d333b',
+  'bg-overlay': '#373e47',
+  'bg-backdrop': '#1c2128cc',
+  'bg-info': '#4184e41a',
+  'bg-info-inverse': '#4184e4',
+  'bg-danger': '#e5534b1a',
+  'bg-danger-inverse': '#c93c37',
+  'bg-success': '#46954a1a',
+  'bg-success-inverse': '#46954a',
+  'bg-warning': '#ae7c141a',
+  'bg-warning-inverse': '#ae7c14',
+  'shadow-small': '0 0 #0000',
+  'shadow-medium': '0 3px 6px #1c2128',
+  'shadow-large': '0 8px 24px #1c2128',
+  'shadow-extra-large': '0 12px 48px #1c2128',
+  'shadow-highlight': '0 0 #0000',
+  'shadow-inset': '0 0 #0000',
+  'state-hover-primary-bg': '#316dca',
+  'state-hover-primary-border': '#4184e4',
+  'state-hover-primary-text': '#cdd9e5',
+  'state-hover-primary-icon': '#cdd9e5',
+  'state-hover-secondary-bg': '#2d333b',
+  'state-hover-secondary-border': '#2d333b',
+  'state-selected-primary-bg': '#316dca',
+  'state-selected-primary-border': '#4184e4',
+  'state-selected-primary-text': '#cdd9e5',
+  'state-selected-primary-icon': '#cdd9e5',
+  'state-focus-border': '#4184e4',
+  'state-focus-shadow': '0 0 0 3px #143d79',
+  'fade-fg-10': '#cdd9e51a',
+  'fade-fg-15': '#cdd9e526',
+  'fade-fg-30': '#cdd9e54d',
+  'fade-fg-50': '#cdd9e580',
+  'fade-fg-70': '#cdd9e5b3',
+  'fade-fg-85': '#cdd9e5d9',
+  'fade-black-10': '#1c21281a',
+  'fade-black-15': '#1c212826',
+  'fade-black-30': '#1c21284d',
+  'fade-black-50': '#1c212880',
+  'fade-black-70': '#1c2128b3',
+  'fade-black-85': '#1c2128d9',
+  'fade-white-10': '#cdd9e51a',
+  'fade-white-15': '#cdd9e526',
+  'fade-white-30': '#cdd9e54d',
+  'fade-white-50': '#cdd9e580',
+  'fade-white-70': '#cdd9e5b3',
+  'fade-white-85': '#cdd9e5d9',
+  'alert-info-text': '#6cb6ff',
+  'alert-info-icon': '#6cb6ff',
+  'alert-info-bg': '#4184e41a',
+  'alert-info-border': '#4184e466',
+  'alert-warn-text': '#daaa3f',
+  'alert-warn-icon': '#daaa3f',
+  'alert-warn-bg': '#ae7c141a',
+  'alert-warn-border': '#ae7c1466',
+  'alert-error-text': '#f47067',
+  'alert-error-icon': '#f47067',
+  'alert-error-bg': '#e5534b1a',
+  'alert-error-border': '#e5534b66',
+  'alert-success-text': '#6bc46d',
+  'alert-success-icon': '#6bc46d',
+  'alert-success-bg': '#46954a1a',
+  'alert-success-border': '#46954a66',
+  'autocomplete-shadow': '0 16px 32px #1c2128d9',
+  'autocomplete-row-border': '#444c56',
+  'blankslate-icon': '#5f6a76',
+  'btn-text': '#adbac7',
+  'btn-bg': '#373e47',
+  'btn-border': '#444c56',
+  'btn-shadow': '0 0 #0000',
+  'btn-inset-shadow': '0 0 #0000',
+  'btn-hover-bg': '#444c56',
+  'btn-hover-border': '#768390',
+  'btn-selected-bg': '#2d333b',
+  'btn-focus-bg': '#373e47',
+  'btn-focus-border': '#768390',
+  'btn-focus-shadow': '0 0 0 3px #7683904d',
+  'btn-shadow-active': 'inset 0 0.15em 0.3em #1c212826',
+  'btn-shadow-input-focus': '0 0 0 0.2em #316dca4d',
+  'btn-primary-text': '#fff',
+  'btn-primary-bg': '#347d39',
+  'btn-primary-border': '#46954a',
+  'btn-primary-shadow': '0 0 #0000',
+  'btn-primary-inset-shadow': '0 0 #0000',
+  'btn-primary-hover-bg': '#46954a',
+  'btn-primary-hover-border': '#57ab5a',
+  'btn-primary-selected-bg': '#347d39',
+  'btn-primary-selected-shadow': '0 0 #0000',
+  'btn-primary-disabled-text': '#cdd9e580',
+  'btn-primary-disabled-bg': '#347d3999',
+  'btn-primary-disabled-border': '#0000',
+  'btn-primary-focus-bg': '#347d39',
+  'btn-primary-focus-border': '#57ab5a',
+  'btn-primary-focus-shadow': '0 0 0 3px #2ea44f66',
+  'btn-primary-icon': '#cdd9e5',
+  'btn-primary-counter-bg': '#cdd9e533',
+  'btn-outline-text': '#539bf5',
+  'btn-outline-hover-text': '#539bf5',
+  'btn-outline-hover-bg': '#444c56',
+  'btn-outline-hover-border': '#539bf5',
+  'btn-outline-hover-shadow': '0 1px 0 #1c21281a',
+  'btn-outline-hover-inset-shadow': 'inset 0 1px 0 #cdd9e508',
+  'btn-outline-hover-counter-bg': '#cdd9e533',
+  'btn-outline-selected-text': '#cdd9e5',
+  'btn-outline-selected-bg': '#1b4b91',
+  'btn-outline-selected-border': '#cdd9e51a',
+  'btn-outline-selected-shadow': '0 0 #0000',
+  'btn-outline-disabled-text': '#539bf580',
+  'btn-outline-disabled-bg': '#22272e',
+  'btn-outline-disabled-counter-bg': '#316dca0d',
+  'btn-outline-focus-border': '#539bf5',
+  'btn-outline-focus-shadow': '0 0 0 3px #255ab266',
+  'btn-outline-counter-bg': '#316dca1a',
+  'btn-danger-text': '#e5534b',
+  'btn-danger-hover-text': '#fff',
+  'btn-danger-hover-bg': '#c93c37',
+  'btn-danger-hover-border': '#e5534b',
+  'btn-danger-hover-shadow': '0 0 #0000',
+  'btn-danger-hover-inset-shadow': '0 0 #0000',
+  'btn-danger-hover-counter-bg': '#fff3',
+  'btn-danger-selected-text': '#fff',
+  'btn-danger-selected-bg': '#ad2e2c',
+  'btn-danger-selected-border': '#cdd9e51a',
+  'btn-danger-selected-shadow': '0 0 #0000',
+  'btn-danger-disabled-text': '#e5534b80',
+  'btn-danger-disabled-bg': '#22272e',
+  'btn-danger-disabled-counter-bg': '#c93c370d',
+  'btn-danger-focus-border': '#e5534b',
+  'btn-danger-focus-shadow': '0 0 0 3px #ad2e2c66',
+  'btn-danger-counter-bg': '#c93c371a',
+  'btn-danger-icon': '#e5534b',
+  'btn-danger-hover-icon': '#cdd9e5',
+  'btn-counter-bg': '#444c56',
+  'counter-text': '#adbac7',
+  'counter-bg': '#444c56',
+  'counter-primary-text': '#adbac7',
+  'counter-primary-bg': '#636e7b',
+  'counter-secondary-text': '#768390',
+  'counter-secondary-bg': '#76839033',
+  'dropdown-shadow': '0 16px 32px #1c2128d9',
+  'label-border': '#444c56',
+  'label-primary-text': '#909dab',
+  'label-primary-border': '#636e7b',
+  'label-secondary-text': '#768390',
+  'label-secondary-border': '#444c56',
+  'label-info-text': '#4184e4',
+  'label-info-border': '#4184e466',
+  'label-success-text': '#57ab5a',
+  'label-success-border': '#46954a66',
+  'label-warning-text': '#daaa3f',
+  'label-warning-border': '#f2d35b66',
+  'label-danger-text': '#e5534b',
+  'label-danger-border': '#e5534b66',
+  'label-orange-text': '#cc6b2c',
+  'label-orange-border': '#cc6b2c66',
+  'input-bg': '#22272e',
+  'input-contrast-bg': '#1c212880',
+  'input-border': '#373e47',
+  'input-shadow': '0 0 #0000',
+  'input-disabled-bg': '#2d333b',
+  'input-disabled-border': '#444c56',
+  'input-warning-border': '#c69026',
+  'input-error-border': '#e5534b',
+  'input-tooltip-success-text': '#6bc46d',
+  'input-tooltip-success-bg': '#263231',
+  'input-tooltip-success-border': '#335a3b',
+  'input-tooltip-warning-text': '#daaa3f',
+  'input-tooltip-warning-bg': '#30302b',
+  'input-tooltip-warning-border': '#624e22',
+  'input-tooltip-error-text': '#f47067',
+  'input-tooltip-error-bg': '#362b31',
+  'input-tooltip-error-border': '#7c3b3b',
+  'avatar-bg': '#cdd9e51a',
+  'avatar-border': '#cdd9e51a',
+  'avatar-stack-fade': '#444c56',
+  'avatar-stack-fade-more': '#373e47',
+  'avatar-child-shadow': '-2px -2px 0 #22272e',
+  'toast-text': '#adbac7',
+  'toast-bg': '#444c56',
+  'toast-border': '#636e7b',
+  'toast-shadow': '0 8px 24px #1c2128',
+  'toast-icon': '#cdd9e5',
+  'toast-icon-bg': '#316dca',
+  'toast-icon-border': '#4184e4',
+  'toast-success-text': '#adbac7',
+  'toast-success-border': '#636e7b',
+  'toast-success-icon': '#cdd9e5',
+  'toast-success-icon-bg': '#46954a',
+  'toast-success-icon-border': '#57ab5a',
+  'toast-warning-text': '#adbac7',
+  'toast-warning-border': '#636e7b',
+  'toast-warning-icon': '#cdd9e5',
+  'toast-warning-icon-bg': '#ae7c14',
+  'toast-warning-icon-border': '#c69026',
+  'toast-danger-text': '#adbac7',
+  'toast-danger-border': '#636e7b',
+  'toast-danger-icon': '#cdd9e5',
+  'toast-danger-icon-bg': '#c93c37',
+  'toast-danger-icon-border': '#e5534b',
+  'toast-loading-text': '#adbac7',
+  'toast-loading-border': '#636e7b',
+  'toast-loading-icon': '#cdd9e5',
+  'toast-loading-icon-bg': '#636e7b',
+  'toast-loading-icon-border': '#768390',
+  'timeline-text': '#909dab',
+  'timeline-badge-bg': '#22272e',
+  'timeline-badge-success-border': '#46954a',
+  'timeline-target-badge-border': '#316dca',
+  'timeline-target-badge-shadow': '#1b4b91',
+  'select-menu-border-secondary': '#444c56',
+  'select-menu-shadow': '0 0 18px #1c212866',
+  'select-menu-backdrop-bg': '#1c212880',
+  'select-menu-backdrop-border': '#545d68',
+  'select-menu-tap-highlight': '#444c5680',
+  'select-menu-tap-focus-bg': '#143d79',
+  'box-blue-border': '#1b4b91',
+  'box-row-yellow-bg': '#ebc4401a',
+  'box-row-blue-bg': '#6cb6ff1a',
+  'box-header-blue-bg': '#22272e',
+  'box-header-blue-border': '#444c56',
+  'box-border-info': '#4184e466',
+  'box-bg-info': '#4184e41a',
+  'box-border-warning': '#ae7c1466',
+  'box-bg-warning': '#ae7c141a',
+  'branch-name-text': '#adbac7',
+  'branch-name-icon': '#909dab',
+  'branch-name-bg': '#539bf51a',
+  'branch-name-link-text': '#539bf5',
+  'branch-name-link-icon': '#539bf5',
+  'branch-name-link-bg': '#539bf51a',
+  'markdown-code-bg': '#cdd9e526',
+  'markdown-frame-border': '#4f5964',
+  'markdown-blockquote-border': '#4f5964',
+  'markdown-table-border': '#4f5964',
+  'markdown-table-tr-border': '#3b424b',
+  'menu-heading-text': '#768390',
+  'menu-border-active': '#f78166',
+  'menu-bg-active': '#2d333b',
+  'sidenav-selected-bg': '#373e47',
+  'sidenav-border-active': '#f78166',
+  'header-text': '#cdd9e5b3',
+  'header-bg': '#2d333b',
+  'header-logo': '#cdd9e5',
+  'filter-item-bar-bg': '#292e35',
+  'hidden-text-expander-bg': '#373e47',
+  'hidden-text-expander-bg-hover': '#444c56',
+  'drag-and-drop-border': '#393f48',
+  'upload-enabled-border': '#4f5964',
+  'upload-enabled-border-focused': '#4f84d4',
+  'previewable-comment-form-border': '#393f48',
+  'underlinenav-border': '#444c5600',
+  'underlinenav-border-hover': '#444c56',
+  'underlinenav-border-active': '#f78166',
+  'underlinenav-text': '#768390',
+  'underlinenav-text-hover': '#adbac7',
+  'underlinenav-text-active': '#adbac7',
+  'underlinenav-icon': '#636e7b',
+  'underlinenav-icon-hover': '#adbac7',
+  'underlinenav-icon-active': '#adbac7',
+  'underlinenav-counter-text': '#768390',
+  'underlinenav-counter-bg': '#76839033',
+  'verified-badge-text': '#57ab5a',
+  'verified-badge-bg': '#57ab5a1a',
+  'verified-badge-border': '#57ab5a66',
+  'social-count-bg': '#373e47',
+  'tooltip-text': '#cdd9e5',
+  'tooltip-bg': '#636e7b',
+  'header-search-bg': '#22272e',
+  'header-search-border': '#373e47',
+  'search-keyword-hl': '#ae7c1466',
+  'diffstat-neutral-bg': '#444c56',
+  'diffstat-neutral-border': '#cdd9e51a',
+  'diffstat-deletion-bg': '#c93c37',
+  'diffstat-deletion-border': '#e5534b',
+  'diffstat-addition-bg': '#347d39',
+  'diffstat-addition-border': '#46954a',
+  'mktg-success': '#3d8942',
+  'mktg-info': '#3877d5',
+  'mktg-bg-shade-gradient-top': '#1c212811',
+  'mktg-bg-shade-gradient-bottom': '#1c212800',
+  'mktg-btn-bg': '#316dca',
+  'mktg-btn-border': '#316dca',
+  'mktg-btn-text': '#cdd9e5',
+  'mktg-btn-icon': '#cdd9e5',
+  'mktg-btn-focus-shadow': '0 0 0 3px #316dca4d',
+  'mktg-btn-hover-bg': '#4184e4',
+  'mktg-btn-hover-border': '#4184e4',
+  'mktg-btn-disabled-bg': '#4184e480',
+  'mktg-btn-disabled-border': '#0000',
+  'mktg-btn-disabled-text': '#cdd9e580',
+  'mktg-btn-disabled-icon': '#cdd9e580',
+  'mktg-btn-primary-bg': '#347d39',
+  'mktg-btn-primary-border': '#347d39',
+  'mktg-btn-primary-text': '#cdd9e5',
+  'mktg-btn-primary-icon': '#cdd9e5',
+  'mktg-btn-primary-focus-shadow': '0 0 0 3px #347d394d',
+  'mktg-btn-primary-hover-bg': '#46954a',
+  'mktg-btn-primary-hover-border': '#46954a',
+  'mktg-btn-primary-disabled-bg': '#46954a80',
+  'mktg-btn-primary-disabled-border': '#0000',
+  'mktg-btn-primary-disabled-text': '#cdd9e580',
+  'mktg-btn-primary-disabled-icon': '#cdd9e580',
+  'mktg-btn-outline-bg': '#0000',
+  'mktg-btn-outline-border': '#4184e480',
+  'mktg-btn-outline-text': '#4184e4',
+  'mktg-btn-outline-icon': '#4184e4',
+  'mktg-btn-outline-focus-shadow': '0 0 0 3px #4184e44d',
+  'mktg-btn-outline-hover-bg': '#0000',
+  'mktg-btn-outline-hover-border': '#4184e4',
+  'mktg-btn-outline-hover-text': '#539bf5',
+  'mktg-btn-outline-hover-icon': '#539bf5',
+  'mktg-btn-outline-disabled-bg': '#0000',
+  'mktg-btn-outline-disabled-border': '#4184e433',
+  'mktg-btn-outline-disabled-text': '#4184e480',
+  'mktg-btn-outline-disabled-icon': '#4184e480',
+  'mktg-btn-dark-bg': '#0000',
+  'mktg-btn-dark-border': '#adbac780',
+  'mktg-btn-dark-text': '#adbac7',
+  'mktg-btn-dark-icon': '#adbac7',
+  'mktg-btn-dark-focus-shadow': '0 0 0 3px #adbac74d',
+  'mktg-btn-dark-hover-bg': '#adbac780',
+  'mktg-btn-dark-hover-border': '#adbac780',
+  'mktg-btn-dark-hover-text': '#22272e',
+  'mktg-btn-dark-hover-icon': '#22272e',
+  'mktg-btn-dark-disabled-bg': '#0000',
+  'mktg-btn-dark-disabled-border': '#adbac733',
+  'mktg-btn-dark-disabled-text': '#adbac780',
+  'mktg-btn-dark-disabled-icon': '#adbac780',
+  'files-explorer-icon': '#636e7b',
+  'hl-author-bg': '#0f2d5c',
+  'hl-author-border': '#1b4b91',
+  'logo-subdued': '#444c56',
+  'discussion-border': '#494c49',
+  'discussion-bg-success': '#46954a1a',
+  'actions-workflow-table-sticky-bg': '#22272ef2',
+  'repo-language-color-border': '#cdd9e533',
+  'code-selection-bg': '#6cb6ff4d',
+  'highlight-text': '#ffd467',
+  'highlight-bg': '#cc8f2c61',
+  'blob-line-highlight-bg': '#c6902626',
+  'blob-line-highlight-border': '#daaa3f',
+  'diff-addition-text': '#6bc46d',
+  'diff-addition-bg': '#46954a33',
+  'diff-addition-border': '#2b6a30',
+  'diff-deletion-text': '#e5534b',
+  'diff-deletion-bg': '#c93c3733',
+  'diff-deletion-border': '#ad2e2c',
+  'diff-change-text': '#daaa3f',
+  'diff-change-bg': '#452700',
+  'diff-change-border': '#966600',
+  'diff-blob-num-text': '#cdd9e54d',
+  'diff-blob-num-hover-text': '#cdd9e599',
+  'diff-blob-addition-num-text': '#57ab5a',
+  'diff-blob-addition-num-hover-text': '#8ddb8c',
+  'diff-blob-addition-num-bg': '#46954a1a',
+  'diff-blob-addition-line-bg': '#46954a33',
+  'diff-blob-addition-word-bg': '#46954a8c',
+  'diff-blob-deletion-num-text': '#e5534b',
+  'diff-blob-deletion-num-hover-text': '#ff938a',
+  'diff-blob-deletion-num-bg': '#c93c371a',
+  'diff-blob-deletion-line-bg': '#c93c3733',
+  'diff-blob-deletion-word-bg': '#c93c3780',
+  'diff-blob-hunk-text': '#768390',
+  'diff-blob-hunk-num-bg': '#539bf526',
+  'diff-blob-hunk-line-bg': '#539bf51a',
+  'diff-blob-empty-block-bg': '#2d333b',
+  'diff-blob-selected-line-highlight-bg': '#ae7c141a',
+  'diff-blob-selected-line-highlight-border': '#ae7c14',
+  'diff-blob-selected-line-highlight-mix-blend-mode': 'normal',
+  'diff-blob-expander-icon': '#768390',
+  'diff-blob-expander-hover-icon': '#cdd9e5',
+  'diff-blob-expander-hover-bg': '#316dca',
+  'diff-blob-comment-button-icon': '#cdd9e5',
+  'diff-blob-comment-button-bg': '#316dca',
+  'diff-blob-comment-button-gradient-bg': '#437bd1',
+  'global-nav-logo': '#cdd9e5',
+  'global-nav-bg': '#2d333b',
+  'global-nav-text': '#adbac7',
+  'global-nav-icon': '#adbac7',
+  'global-nav-input-bg': '#22272e',
+  'global-nav-input-border': '#373e47',
+  'global-nav-input-icon': '#373e47',
+  'global-nav-input-placeholder': '#545d68',
+  'calendar-graph-day-bg': '#2d333b',
+  'calendar-graph-day-border': '#1b1f230f',
+  'calendar-graph-day-L1-bg': '#003820',
+  'calendar-graph-day-L2-bg': '#00602d',
+  'calendar-graph-day-L3-bg': '#10983d',
+  'calendar-graph-day-L4-bg': '#27d545',
+  'calendar-graph-day-L4-border': '#ffffff0d',
+  'calendar-graph-day-L3-border': '#ffffff0d',
+  'calendar-graph-day-L2-border': '#ffffff0d',
+  'calendar-graph-day-L1-border': '#ffffff0d',
+  'footer-invertocat-octicon': '#444c56',
+  'footer-invertocat-octicon-hover': '#636e7b',
+  'pr-state-draft-text': '#768390',
+  'pr-state-draft-bg': '#7683901a',
+  'pr-state-draft-border': '#76839066',
+  'pr-state-open-text': '#57ab5a',
+  'pr-state-open-bg': '#57ab5a1a',
+  'pr-state-open-border': '#57ab5a66',
+  'pr-state-merged-text': '#986ee2',
+  'pr-state-merged-bg': '#b083f01a',
+  'pr-state-merged-border': '#b083f066',
+  'pr-state-closed-text': '#e5534b',
+  'pr-state-closed-bg': '#c93c371a',
+  'pr-state-closed-border': '#c93c3766',
+  'topic-tag-text': '#539bf5',
+  'topic-tag-bg': '#4184e41a',
+  'topic-tag-hover-bg': '#4184e433',
+  'topic-tag-active-bg': '#4184e426',
+  'merge-box-success-icon-bg': '#46954a1a',
+  'merge-box-success-icon-text': '#57ab5a',
+  'merge-box-success-icon-border': '#46954a66',
+  'merge-box-success-indicator-bg': '#347d39',
+  'merge-box-success-indicator-border': '#46954a',
+  'merge-box-merged-icon-bg': '#b083f01a',
+  'merge-box-merged-icon-text': '#986ee2',
+  'merge-box-merged-icon-border': '#b083f066',
+  'merge-box-merged-box-border': '#b083f066',
+  'merge-box-neutral-icon-bg': '#adbac71a',
+  'merge-box-neutral-icon-text': '#768390',
+  'merge-box-neutral-icon-border': '#adbac766',
+  'merge-box-neutral-indicator-bg': '#545d68',
+  'merge-box-neutral-indicator-border': '#636e7b',
+  'merge-box-warning-icon-bg': '#ae7c141a',
+  'merge-box-warning-icon-text': '#daaa3f',
+  'merge-box-warning-icon-border': '#ae7c1466',
+  'merge-box-warning-box-border': '#ae7c1466',
+  'merge-box-warning-merge-highlight': '#ae7c141a',
+  'merge-box-error-icon-bg': '#e5534b1a',
+  'merge-box-error-icon-text': '#e5534b',
+  'merge-box-error-icon-border': '#e5534b66',
+  'merge-box-error-indicator-bg': '#c93c37',
+  'merge-box-error-indicator-border': '#e5534b',
+  'project-card-bg': '#2d333b',
+  'project-header-bg': '#22272e',
+  'project-sidebar-bg': '#2d333b',
+  'project-gradient-in': '#2d333b',
+  'project-gradient-out': '#2d333b00',
+  'checks-bg': '#1e2228',
+  'checks-run-border-width': '1px',
+  'checks-container-border-width': '1px',
+  'checks-text-primary': '#adbac7',
+  'checks-text-secondary': '#768390',
+  'checks-text-link': '#539bf5',
+  'checks-btn-icon': '#636e7b',
+  'checks-btn-hover-icon': '#adbac7',
+  'checks-btn-hover-bg': '#444c56',
+  'checks-input-text': '#768390',
+  'checks-input-placeholder-text': '#545d68',
+  'checks-input-focus-text': '#adbac7',
+  'checks-input-bg': '#22272e',
+  'checks-input-shadow': '0 0 0 1px #373e47',
+  'checks-dropdown-text': '#adbac7',
+  'checks-dropdown-bg': '#373e47',
+  'checks-dropdown-border': '#444c56',
+  'checks-dropdown-hover-text': '#cdd9e5',
+  'checks-dropdown-hover-bg': '#316dca',
+  'checks-dropdown-btn-hover-text': '#cdd9e5',
+  'checks-dropdown-btn-hover-bg': '#2d333b',
+  'checks-scrollbar-thumb-bg': '#444c56',
+  'checks-header-label-text': '#768390',
+  'checks-header-label-open-text': '#adbac7',
+  'checks-header-border': '#373e47',
+  'checks-header-icon': '#636e7b',
+  'checks-line-text': '#768390',
+  'checks-line-num-text': '#768390',
+  'checks-line-timestamp-text': '#768390',
+  'checks-line-hover-bg': '#2d333b',
+  'checks-line-selected-bg': '#4184e41a',
+  'checks-line-selected-num-text': '#539bf5',
+  'checks-line-dt-fm-text': '#22272e',
+  'checks-line-dt-fm-bg': '#c69026',
+  'checks-gate-bg': '#80540026',
+  'checks-gate-text': '#768390',
+  'checks-gate-waiting-text': '#daaa3f',
+  'checks-step-header-open-bg': '#2d333b',
+  'checks-step-error-text': '#e5534b',
+  'checks-step-warning-text': '#daaa3f',
+  'checks-logline-text': '#636e7b',
+  'checks-logline-num-text': '#768390',
+  'checks-logline-debug-text': '#b083f0',
+  'checks-logline-error-text': '#768390',
+  'checks-logline-error-num-text': '#768390',
+  'checks-logline-error-bg': '#e5534b1a',
+  'checks-logline-warning-text': '#768390',
+  'checks-logline-warning-num-text': '#daaa3f',
+  'checks-logline-warning-bg': '#ae7c141a',
+  'checks-logline-command-text': '#539bf5',
+  'checks-logline-section-text': '#6bc46d',
+  'intro-shelf-gradient-left': '#4184e41a',
+  'intro-shelf-gradient-right': '#46954a1a',
+  'intro-shelf-gradient-in': '#22272e',
+  'intro-shelf-gradient-out': '#22272e00',
+  'marketing-icon-primary': '#6cb6ff',
+  'marketing-icon-secondary': '#316dca',
+  'prettylights-syntax-comment': '#768390',
+  'prettylights-syntax-constant': '#6cb6ff',
+  'prettylights-syntax-entity': '#dcbdfb',
+  'prettylights-syntax-storage-modifier-import': '#adbac7',
+  'prettylights-syntax-entity-tag': '#8ddb8c',
+  'prettylights-syntax-keyword': '#f47067',
+  'prettylights-syntax-string': '#96d0ff',
+  'prettylights-syntax-variable': '#f69d50',
+  'prettylights-syntax-brackethighlighter-unmatched': '#e5534b',
+  'prettylights-syntax-invalid-illegal-text': '#cdd9e5',
+  'prettylights-syntax-invalid-illegal-bg': '#922323',
+  'prettylights-syntax-carriage-return-text': '#cdd9e5',
+  'prettylights-syntax-carriage-return-bg': '#ad2e2c',
+  'prettylights-syntax-string-regexp': '#8ddb8c',
+  'prettylights-syntax-markup-list': '#eac55f',
+  'prettylights-syntax-markup-heading': '#316dca',
+  'prettylights-syntax-markup-italic': '#adbac7',
+  'prettylights-syntax-markup-bold': '#adbac7',
+  'prettylights-syntax-markup-deleted-text': '#ffd8d3',
+  'prettylights-syntax-markup-deleted-bg': '#78191b',
+  'prettylights-syntax-markup-inserted-text': '#b4f1b4',
+  'prettylights-syntax-markup-inserted-bg': '#1b4721',
+  'prettylights-syntax-markup-changed-text': '#ffddb0',
+  'prettylights-syntax-markup-changed-bg': '#682d0f',
+  'prettylights-syntax-markup-ignored-text': '#adbac7',
+  'prettylights-syntax-markup-ignored-bg': '#255ab2',
+  'prettylights-syntax-meta-diff-range': '#dcbdfb',
+  'prettylights-syntax-brackethighlighter-angle': '#768390',
+  'prettylights-syntax-sublimelinter-gutter-mark': '#545d68',
+  'prettylights-syntax-constant-other-reference-link': '#96d0ff',
+  'codemirror-text': '#adbac7',
+  'codemirror-bg': '#22272e',
+  'codemirror-gutters-bg': '#22272e',
+  'codemirror-guttermarker-text': '#22272e',
+  'codemirror-guttermarker-subtle-text': '#636e7b',
+  'codemirror-linenumber-text': '#768390',
+  'codemirror-cursor': '#cdd9e5',
+  'codemirror-selection-bg': '#6cb6ff4d',
+  'codemirror-activeline-bg': '#2d333b',
+  'codemirror-matchingbracket-text': '#adbac7',
+  'codemirror-lines-bg': '#22272e',
+  'codemirror-syntax-comment': '#768390',
+  'codemirror-syntax-constant': '#6cb6ff',
+  'codemirror-syntax-entity': '#dcbdfb',
+  'codemirror-syntax-keyword': '#f47067',
+  'codemirror-syntax-storage': '#f47067',
+  'codemirror-syntax-string': '#96d0ff',
+  'codemirror-syntax-support': '#6cb6ff',
+  'codemirror-syntax-variable': '#f69d50',
+  'ansi-black': '#22272e',
+  'ansi-black-bright': '#2d333b',
+  'ansi-white': '#909dab',
+  'ansi-white-bright': '#909dab',
+  'ansi-gray': '#636e7b',
+  'ansi-red': '#f47067',
+  'ansi-red-bright': '#ff938a',
+  'ansi-green': '#57ab5a',
+  'ansi-green-bright': '#6bc46d',
+  'ansi-yellow': '#c69026',
+  'ansi-yellow-bright': '#daaa3f',
+  'ansi-blue': '#539bf5',
+  'ansi-blue-bright': '#6cb6ff',
+  'ansi-magenta': '#b083f0',
+  'ansi-magenta-bright': '#dcbdfb',
+  'ansi-cyan': '#76e3ea',
+  'ansi-cyan-bright': '#b3f0ff',
+);
diff --git a/src/styles/themes.scss b/src/styles/themes.scss
index f6ca6a1..05e82df 100644
--- a/src/styles/themes.scss
+++ b/src/styles/themes.scss
@@ -1,5 +1,6 @@
 @use './light/variables.scss' as light;
 @use './dark/variables.scss' as dark;
+@use './darkDimmed/variables.scss' as darkDimmed;
 
 @mixin setVariables($variables) {
   @each $name, $value in $variables {
@@ -7,23 +8,35 @@
   }
 }
 
-:root, // default
-:root[data-color-mode='light'] {
-  @include setVariables(light.$variables);
+@mixin bindTheme($name) {
+  &[data-#{$name}-theme='light'] {
+    @include setVariables(light.$variables);
+  }
+  &[data-#{$name}-theme='dark'] {
+    @include setVariables(dark.$variables);
+  }
+  &[data-#{$name}-theme='dark_dimmed'] {
+    @include setVariables(darkDimmed.$variables);
+  }
 }
 
-:root[data-color-mode='dark'][data-dark-theme='dark'] {
-  @include setVariables(dark.$variables);
+:root, // default
+:root[data-color-mode='light'] {
+  @include bindTheme('light');
+}
+
+:root[data-color-mode='dark'] {
+  @include bindTheme('dark');
 }
 
 @media (prefers-color-scheme: light) {
-  :root[data-color-mode='auto'][data-light-theme='light'] {
-    @include setVariables(light.$variables);
+  :root[data-color-mode='auto'] {
+    @include bindTheme('light');
   }
 }
 
 @media (prefers-color-scheme: dark) {
-  :root[data-color-mode='auto'][data-dark-theme='dark'] {
-    @include setVariables(dark.$variables);
+  :root[data-color-mode='auto'] {
+    @include bindTheme('dark');
   }
 }