Skip to content

TamperMonkey.net – Dark [Ath] by Athari

Imported and mirrored from https://github.com/Athari/AthariUserCSS/raw/master/TamperMonkey/TamperMonkey-CustomDark.user.css

Screenshot of TamperMonkey.net – Dark [Ath]
Homepage Write a review Install Get Stylus

Details

AuthorAthari

LicenseMIT

Categorytampermonkey

Created

Updated

Size19 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Dark theme for TamperMonkey.net. Also applies to the docs and the popup during userscript installation. Colors configurable using dark magic™.

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           TamperMonkey.net – Dark [Ath]
@namespace      athari
@version        1.0.0
@description    Dark theme for TamperMonkey.net. Also applies to the docs and the popup during userscript installation. Colors configurable using dark magic™.
@author         Athari (https://github.com/Athari)
@homepageURL    https://github.com/Athari/AthariUserCSS
@supportURL     https://github.com/Athari/AthariUserCSS/issues
@license        MIT
@preprocessor   default

@var            range    l "Lightness base"     [1.2, -1.0, 2.0, 0.02]
@var            range    m "Lightness contrast" [-1.0, -2.0, 2.0, 0.02]
@var            range    c "Chroma base"        [0.03, 0.0, 0.37, 0.01]
@var            range    d "Chroma contrast"    [1.6, -2.0, 2.0, 0.05]
@var            range    h "Hue base"           [180, 0, 360, 5]
@var            range    i "Hue contrast"       [0.0, -1.0, 1.0, 0.05]
@var            checkbox q "Invert images"      1
==/UserStyle== */

@-moz-document domain("tampermonkey.net") {
  /* manual */
  :root {
    color-scheme: dark;
  }

  /* generated */
  .mainnav, .mainnav .tabs {
    background-color: oklch(from #000000 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .tabview .tab + .tab {
    border-left-color: oklch(from #000000 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .tabview .tab-label {
    background-color: oklch(from #555 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .tabview .tab-label, .tabview .tab-label * {
    color: oklch(from #fff calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    fill: oklch(from #fff calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .tabview .tab-content {
    background-color: oklch(from #fff calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    color: oklch(from #363636 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    border-bottom-color: oklch(from #bdc3c7 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .tabview .tab-switch:checked + .tab-label {
    background-color: oklch(from #eeeeed calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    border-right-color: oklch(from #fff calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .tabview .tab-switch:checked + .tab-label, .tabview .tab-switch:checked + .tab-label * {
    color: oklch(from #363636 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    fill: oklch(from #363636 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .tabview .menu-button {
    color: oklch(from white calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  @media only screen and (max-width: 45em) {
    .tabview .menu-button-switch:checked + .menu-button ~ .tabs .tab {
      border-bottom-color: oklch(from #ddd calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    }
  }
  .subnav, .subnav .tabs {
    background-color: oklch(from #eeeeed calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h)) !important;
    background: -moz-linear-gradient(to bottom, oklch(from #eeeeed calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h)) 0, oklch(from #DDD calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h)) 100%);
    background: -webkit-linear-gradient(top, oklch(from #eeeeed calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h)) 0, oklch(from #DDD calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h)) 100%);
    background: linear-gradient(to bottom, oklch(from #eeeeed calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h)) 0, oklch(from #DDD calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h)) 100%);
  }
  .subnav .menu-button {
    color: oklch(from #555 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .subnav .tab-label {
    background-color: oklch(from #888 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    border-color: oklch(from #555 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .subnav .tab + .tab {
    border-left-color: oklch(from #DDD calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .subnav .tab-switch:checked + .tab-label {
    background-color: oklch(from #fff calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  body.acceptable .advent_head {
    background-color: oklch(from #ddd calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    color: oklch(from #393838 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .content .searcad .head {
    color: oklch(from #777777 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .content .searcad.incontent.right {
    background-color: oklch(from white calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .not_found h1 {
    color: oklch(from red calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .dialog.modal > .overlay:after {
    background-color: oklch(from rgba(0, 0, 0, 0.5) calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .dialog > .container {
    background-color: oklch(from #555 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    color: oklch(from white calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .dialog > .container .head {
    border-left-color: oklch(from #555 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    border-top-color: oklch(from #606060 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    border-right-color: oklch(from #666 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .dialog > .container .content {
    border-left-color: oklch(from #555 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    border-right-color: oklch(from #666 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    border-bottom-color: oklch(from #606060 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    background-color: oklch(from #fefefe calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .language {
    color: oklch(from #eee calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .language select {
    background-color: oklch(from #555 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    box-shadow: 2px 2px 5px 1px oklch(from rgba(0, 0, 0, 0.3) calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    color: oklch(from #eee calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .language::before {
    color: oklch(from #eee calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .malicious-warning {
    color: oklch(from red calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .download .tiles ul li + li {
    border-left-color: oklch(from grey calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .download .tiles .tile {
    background-color: oklch(from #ddd calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .download .tiles div {
    color: oklch(from #333 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .download .tiles .hint {
    color: oklch(from #444 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .download .tiles .button {
    background-color: oklch(from #4CAF50 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
    color: oklch(from white calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .download .tiles .button svg {
    fill: oklch(from white calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .download .tiles .button.file {
    background-color: oklch(from #a0a0a0 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .download .tiles .button.help {
    background-color: oklch(from #258df4 calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .download .tiles a.button, .download .tiles a.button:visited {
    color: oklch(from white calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h)) !important;
  }
  .download .tiles a.button svg, .download .tiles a.button:visited svg {
    fill: oklch(from white calc(var(--l) + var(--m) * l) calc(var(--c) + var(--d) * c) calc(var(--h) + var(--i) * h));
  }
  .download ....

Reviews

No reviews yet.