Skip to content

ImgBB Dark Mode by Avistella

Screenshot of ImgBB Dark Mode

Details

AuthorAvistella

LicenseCC-BY-NC-SA-4.0

Categoryimgbb.com

Created

Updated

Size4.1 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Dark mode for ImgBB

Notes

Userstyle doesn't have notes.

Source code

/* ==UserStyle==
@name           ImgBB Dark Mode
@namespace      ImgBB Dark Mode | Avistella
@version        1.0.0
@description    Dark mode for ImgBB
@author         Avistella
@license        CC-BY-NC-SA-4.0
@preprocessor   stylus

@var color      mbg             "Main background"               "#252525"
@var color      sbg             "Secondary background"          "#2c2c2c"
@var color      dbg             "Dropdown background"           "#3c3c3c"
@var color      txt             "Text"                          "#eeeeee"
@var color      brd             "Border"                        "#343434"
@var color      lks             "Links"                         "#38b29a"
@var color      lksh            "Links on hover"                "#8adccc"
@var color      btnsbg          "Buttons background"            "#268975"
@var color      btnstxt         "Buttons text"                  "#fff"
@var color      btnsbgh         "Buttons background on hover"   "#0a6458"
@var checkbox   rpp             "Hide pro upgrade plans"        1
==/UserStyle== */

@-moz-document domain("imgbb.com"), 
               domain("ibb.co") {
    
    body, html, .pricing-tier-box, .or-separator span, .pop-box, .tone-light button.copy-input, .tone-light button.input-action, #background-cover.no-background, .tone-light #fullscreen-modal-box {
        background-color:mbg;
        color:txt;
    }
    .pop-box-menu li.current a {
        background-color:mbg;
        color:lks;
    }
    .arrow-box-top::after {
        border-color:brd;
    }
    .text-input, input[type="text"]:not(.text-input), textarea {
        background-color:dbg;
        color:txt;
    }
    .footer, .upload-box-allowed-files, .panel-share-item h4.pre-title, .number-figures span:not(.icon), .content-empty {
        color:rgba(txt,.75);
    }
    
    .about, #anywhere-upload, .upload-box-queue li {
        background-color:sbg;
    }
    
    .pricing-tier-box li, .tone-light .top-bar::before, .panel-share-item h4.pre-title {
        border-color:brd;
    }
    
    .tone-light .follow-scroll-wrapper.position-fixed, .tone-light .header.follow-scroll, .tone-light .panel-thumbs, .tone-light .top-bar::before, .tone-light.phablet .header ul.content-tabs, .tone-light.phone .header ul.content-tabs, .list-item-image {
        background-color:sbg;
    }
    
    a, .tone-light .top-bar #menu-fullscreen .top-btn-text, .tone-light .top-btn-text, .top-bar ul li.top-btn-el a, .upload-box-heading .icon, .pop-box-menu a.link--delete, .tone-dark .pop-box-menu a.link--delete, [data-action="delete"], a.link--delete {
        color:lks;
    }
    .top-bar ul .pop-btn.current, .top-bar ul .top-btn-el.current, .content-tabs li.current, .growl, .content-tabs li.current, .content-tabs li.visited, .content-tabs li.visited:hover, .content-tabs li:hover  {
        border-color:lks;
    }
    .tone-light .top-bar #menu-fullscreen > ul > li .arrow-down, .tone-light .top-bar .arrow-down {
        border-top-color:lks;
    }
    .input-focus, input.search:focus, input:focus, select:focus, textarea:focus {
        border-color:lks;
        box-shadow:0 0 8px 0 rgba(lks, 0.45);
    }
    
    a:hover, .tone-light .top-bar .opened .top-btn-text:not(.btn), .tone-light .top-bar .top-btn-text:hover:not(.btn), .top-user h1 a, a.number-figures:hover, a.number-figures:hover * {
        color:lksh;
    }
    .tone-light .top-bar .opened .arrow-down, .tone-light .top-bar .top-btn-text:hover .arrow-down {
        border-top-color:lksh;
    }
    
    .btn.active, .btn.black, .btn.blue, .btn.green, .btn.orange, .btn.red, .btn.default, .btn.grey, .btn.grey.off:hover, .pop-box-menu a.focus, html:not(.phone) .pop-box-menu a:hover, .growl {
        background-color:btnsbg;
        color:btnstxt;
    }
    .btn.blue.outline {
        color:btnstxt;
        border:0;
    }
    .btn.default:hover, .btn.green:hover, .btn.outline:hover, .btn.outline:hover, .btn.blue:hover, .btn.grey:hover, .btn.red:hover {
        background-color:btnsbgh;
        color:btnstxt;
    }
    
    if rpp == 1 {
        #home-cover-content.about {
            display:none;
        }
    }
    
}

Reviews

No reviews yet.