A new userstyle
stackexchange dark mode by forivall
Details
Authorforivall
LicenseCC Zero
Categorystackexchange,stackoverflow
Created
Updated
Size17 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name stackexchange dark mode
@namespace github.com/openstyles/stylus
@version 1.0.1
@description A new userstyle
@author Me
==/UserStyle== */
@-moz-document domain("stackexchange.com"), domain("unix.stackexchange.com"), domain("serverfault.com"), domain("meta.stackoverflow.com") {
.site-header::before {
z-index: -1;
content: '';
position: absolute;
width: 100%;
height: 5.1em;
background-image: radial-gradient(60% 150% at 10% 0, hsla(210,9%,91.5%, 0.4), hsla(210,9%,91.5%, 0) 68%);
max-width: unset;
}
img[src="https://cdn.sstatic.net/stackexchange/Img/panda-huh.jpg?v=982c22648d95"] + * {
color: black;
}
body:not(.theme-light__forced):not(.theme-light__forced),
body.unified-theme:not(.theme-light__forced):not(.theme-light__forced),
body.unified-theme:not(.theme-light__forced):not(.theme-light__forced) * {
--white: hsl(0,0%,17.5%);
--black: hsl(0,0%,100%);
--black-025: hsl(0,0%,22.5%);
--black-050: hsl(0,0%,24%);
--black-075: hsl(210,4%,26%);
--black-100: hsl(210,4.5%,30.5%);
--black-150: hsl(210,5%,35%);
--black-200: hsl(210,5.5%,43.5%);
--black-300: hsl(210,6.5%,52%);
--black-350: hsl(210,7%,61%);
--black-400: hsl(210,8%,65%);
--black-500: hsl(210,8%,70%);
--black-600: hsl(210,7%,78.5%);
--black-700: hsl(210,8%,82.5%);
--black-750: hsl(210,9%,86.5%);
--black-800: hsl(210,9%,91.5%);
--black-900: hsl(210,4%,95%);
--orange-050: hsl(27,16.5%,23.9%);
--orange-100: hsl(27,30%,28.4%);
--orange-200: hsl(27,50%,36.9%);
--orange-300: hsl(27,70%,47.3%);
--orange-400: hsl(27,90.5%,54.9%);
--orange-500: hsl(27,100%,59%);
--orange-600: hsl(27,100%,68.4%);
--orange-700: hsl(27,89.5%,74.1%);
--orange-800: hsl(27,92%,85.7%);
--orange-900: hsl(27,95%,91.8%);
--blue-050: hsl(206,40%,23%);
--blue-100: hsl(206,44%,26%);
--blue-200: hsl(206,46%,30%);
--blue-300: hsl(206,53%,35%);
--blue-400: hsl(209,56%,43%);
--blue-500: hsl(206,64%,51%);
--blue-600: hsl(206,100%,60%);
--blue-700: hsl(206,90%,74%);
--blue-800: hsl(206,95%,86%);
--blue-900: hsl(206,91%,91.5%);
--powder-050: hsl(205,5%,27%);
--powder-100: hsl(205,14%,28%);
--powder-200: hsl(205,17.5%,32%);
--powder-300: hsl(205,19.5%,37%);
--powder-400: hsl(205,22.5%,44%);
--powder-500: hsl(205,29%,54%);
--powder-600: hsl(205,50%,65.5%);
--powder-700: hsl(205,46.5%,73.5%);
--powder-800: hsl(205,49.5%,87%);
--powder-900: hsl(205,100%,95%);
--green-025: hsl(140,18%,22%);
--green-050: hsl(140,18%,25%);
--green-100: hsl(140,22.5%,31%);
--green-200: hsl(140,23.5%,37%);
--green-300: hsl(140,25%,40.5%);
--green-400: hsl(140,27.5%,48.5%);
--green-500: hsl(140,35%,54.5%);
--green-600: hsl(140,40%,61.5%);
--green-700: hsl(140,39.5%,69.5%);
--green-800: hsl(140,39.5%,78.5%);
--green-900: hsl(140,38%,86.5%);
--yellow-050: hsl(47,13%,24.5%);
--yellow-100: hsl(47,19%,27%);
--yellow-200: hsl(47,30.5%,31%);
--yellow-300: hsl(47,37%,36%);
--yellow-400: hsl(47,45.5%,42.5%);
--yellow-500: hsl(47,55.5%,48%);
--yellow-600: hsl(47,67.5%,55.5%);
--yellow-700: hsl(47,84.5%,64%);
--yellow-800: hsl(47,90%,72.5%);
--yellow-900: hsl(47,93%,83.5%);
--red-025: hsl(1,10%,24%);
--red-050: hsl(1,30%,26.5%);
--red-100: hsl(1,35%,33%);
--red-200: hsl(1,37%,38.5%);
--red-300: hsl(1,39%,43.5%);
--red-400: hsl(1,42%,49%);
--red-500: hsl(1,50%,54%);
--red-600: hsl(1,56.5%,59.5%);
--red-700: hsl(1,62.5%,65.5%);
--red-800: hsl(1,64%,74%);
--red-900: hsl(1,65.5%,85.5%);
--gold: hsl(48,100%,50%);
--gold-lighter: hsl(48,22%,30%);
--gold-darker: hsl(45,100%,47%);
--silver: hsl(210,6%,72%);
--silver-lighter: hsl(0,0%,26%);
--silver-darker: hsl(210,3%,61%);
--bronze: hsl(28,38%,67%);
--bronze-lighter: hsl(28,13%,27%);
--bronze-darker: hsl(28,31%,52%);
--bc-lightest: var(--black-025);
--bc-lighter: var(--black-050);
--bc-light: var(--black-075);
--bc-medium: var(--black-100);
--bc-dark: var(--black-150);
--bc-darker: var(--black-200);
--fc-dark: var(--black-900);
--fc-medium: var(--black-700);
--fc-light: var(--black-500);
--focus-ring-success: hsla(140,40%,75%,0.4);
--focus-ring-warning: hsla(47,79%,58%,0.4);
--focus-ring-error: hsla(358,62%,52%,0.3);
--focus-ring-muted: hsla(0,0%,100%,0.1);
--_o-disabled: .5;
--_o-disabled-static: .5;
--bs-sm: 0 1px 2px hsla(0,0%,0%,0.1), 0 1px 4px hsla(0, 0%, 0%, 0.1), 0 2px 8px hsla(0, 0%, 0%, 0.1);
--bs-md: 0 1px 3px hsla(0,0%,0%,0.11), 0 2px 6px hsla(0, 0%, 0%, 0.11), 0 3px 8px hsla(0, 0%, 0%, 0.14);
--bs-lg: 0 1px 4px hsla(0,0%,0%,0.14), 0 3px 8px hsla(0, 0%, 0%, 0.14), 0 4px 13px hsla(0, 0%, 0%, 0.18);
--bs-xl: 0 10px 24px hsla(0,0%,0%,0.1), 0 20px 48px hsla(0, 0%, 0%, 0.1), 0 1px 4px hsla(0, 0%, 0%, 0.15);
--scrollbar: hsla(0,0%,100%,0.2);
--highlight-bg: hsl(0,2%,11%);
--highlight-color: var(--black);
--highlight-comment: hsl(0,0%,60%);
--highlight-punctuation: hsl(0,0%,80%);
--highlight-namespace: hsl(27,85%,61.5%);
--highlight-attribute: hsl(207,41.5%,67%);
--highlight-literal: hsl(27,85%,61.5%);
--highlight-symbol: hsl(306,43%,69%);
--highlight-keyword: hsl(208,41.5%,67%);
--highlight-variable: hsl(65.5,39%,57.5%);
--highlight-addition: var(--green-600);
--highlight-deletion: var(--red-700)
}
body:not(.theme-light__forced):not(.theme-light__forced),
body.unified-theme:not(.theme-light__forced):not(.theme-light__forced),
body.unified-theme:not(.theme-light__forced):not(.theme-light__forced) * {
color: var(--theme-body-font-color);
--theme-primary-color-h: var(--theme-dark-primary-color-h, var(--theme-base-primary-color-h));
--theme-primary-color-s: var(--theme-dark-primary-color-s, var(--theme-base-primary-color-s));
--theme-primary-color-l: var(--theme-dark-primary-color-l, var(--theme-base-primary-color-l));
--theme-primary-color-r: var(--theme-dark-primary-color-r, var(--theme-base-primary-color-r));
--theme-primary-color-g: var(--theme-dark-primary-color-g, var(--theme-base-primary-color-g));
--theme-primary-color-b: var(--theme-dark-primary-color-b, var(--theme-base-primary-color-b));
--theme-secondary-color-h: var(--theme-dark-secondary-color-h, var(--theme-base-secondary-color-h));
--theme-secondary-color-s: var(--theme-dark-secondary-color-s, var(--theme-base-secondary-color-s));
--theme-secondary-color-l: var(--theme-dark-secondary-color-l, var(--theme-base-secondary-color-l));
--theme-secondary-color-r: var(--theme-dark-secondary-color-r, var(--theme-base-secondary-color-r));
--theme-secondary-color-g: var(--theme-dark-secondary-color-g, var(--theme-base-secondary-color-g));
--theme-secondary-color-b: var(--theme-dark-secondary-color-b, var(--theme-base-secondary-color-b));
--theme-primary-color: hsl(var(--theme-primary-color-h), var(--theme-primary-color-s), var(--theme-primary-color-l));
--theme-secondary-color: hsl(var(--theme-secondary-color-h), var(--theme-secondary-color-s), var(--theme-secondary-color-l));
--theme-primary-025: hsl(var(--theme-primary-color-h), clamp(10%, calc(var(--theme-primary-color-s) - 82%), 90%), clamp(20%, calc(var(--theme-primary-color-l) - 17%), 100%));
--theme-primary-050: hsl(var(--theme-primary-color-h), clamp(10%, calc(var(--theme-primary-color-s) - 47%), 90%), clamp(20%, calc(var(--theme-primary-color-l) - 15%), 100%));
--theme-primary-075: hsl(var(--theme-primary-color-h), clamp(10%, calc(var(--theme-primary-color-s) - 39%), 90%), clamp(20%, calc(var(--theme-primary-color-l) - 13%), 100%));
--theme-primary-100: hsl(var(--theme-primary-color-h), clamp(10%, calc(var(--theme-primary-color-s) - 32%), 90%), clamp(20%, calc(var(--theme-primary-color-l) - 11%), 100%));
--theme-primary-150: hsl(var(--theme-primary-color-h), clamp(10%, calc(var(--theme-primary-color-s) - 23%), 90%), clamp(20%, calc(var(--theme-primary-color-l) - 9%), 100%));
--theme-primary-200: hsl(var(--theme-primary-color-h), clamp(10%, calc(var(--theme-primary-color-s) - 15%), 90%), clamp(20%, calc(var(--theme-primary-color-l) - 7%), 100%));
--theme-primary-300: hsl(var(--theme-primary-color-h), clamp(10%, calc(var(--theme-primary-color-s) - 7%), 90%), clamp(20%, calc(var(--theme-primary-color-l) - 5%), 100%));
--theme-primary-350: var(--theme-primary-color);
--theme-primary-400: rgb(calc(53.55 + var(--theme-primary-color-r) * .79), calc(53.55 + var(--theme-primary-color-g) * .79), calc(53.55 + var(--theme-primary-color-b) * .79));
--theme-primary-500: rgb(calc(91.8 + var(--theme-primary-color-r) * .64), calc(91.8 + var(--theme-primary-color-g) * .64), calc(91.8 + var(--theme-primary-color-b) * .64));
--theme-primary-600: rgb(calc(130.05 + var(--theme-primary-color-r) * .49), calc(130.05 + var(--theme-primary-color-g) * .49), calc(130.05 + var(--theme-primary-color-b) * .49));
--theme-primary-700: rgb(calc(168.3 + var(--theme-primary-color-r) * .34), calc(168.3 + var(--theme-primary-color-g) * .34), calc(168.3 + var(--theme-primary-color-b) * .34));
--theme-primary-800: rgb(calc(206.55 + var(--theme-primary-color-r) * .19), calc(206.55 + var(--theme-primary-color-g) * .19), calc(206.55 + var(--theme-primary-color-b) * .19));
--theme-primary-900: rgb(calc(244.8 + var(--theme-primary-color-r) * .04), calc(244.8 + var(--theme-primary-color-g) * .04), calc(244.8 + var(--theme-primary-color-b) * .04));
--theme-secondary-025: hsl(var(--theme-secondary-color-h), clamp(10%, calc(var(--theme-secondary-color-s) - 82%), 90%), clamp(20%, calc(var(--theme-secondary-color-l) - 17%), 100%));
--theme-secondary-050: hsl(var(--theme-secondary-color-h), clamp(10%, calc(var(--theme-secondary-color-s) - 47%), 90%), clamp(20%, calc(...