Discord Color Theme by frozenmango747
Details
Authorfrozenmango747
LicenseNo License
Created
Updated
CategoryDiscord
Description
Change the color of Discord - black and white is boring!
Notes
Userstyle doesn't have notes.Source code
/* ==UserStyle==
@name Discord Color Theme
@namespace github.com/openstyles/stylus
@version 1.0.0
@description A new userstyle
@author Me
@preprocessor stylus
@var color mod1 "Modifier 1" rgba(225, 68, 16, .659)
@var color mod2 "Modifier 2" rgba(225, 80, 54, .51)
@var color mod3 "Modifier 3" rgba(225, 80, 54, .55)
@var color mod4 "Modifier 4" rgba(225, 80, 54, .32)
@var color mod5 "Modifier 5" rgba(223, 80, 63, .32)
@var color mod6 "Modifier 6" rgba(255, 90, 66, .16)
@var color mod7 "Modifier 7" rgba(223, 87, 63, .11)
@var color base1 "Base 1" #F1A99B
@var color base2 "Base 2" #c43d00
@var color base3 "Base 3" #f4b7a6
@var color base4 "Base 4" #f0a493
@var color base5 "Base 5" #f7a08d
@var color base6 "Base 6" #ec9362
@var color base7 "Base 7" #f0a894
@var color base8 "Base 8" #f6b4a1
@var color base9 "Base 9" #fdc5b5
@var color base10 "Base 10" #eab3a3
@var color accent-color "Accent Color" #ead497
==/UserStyle== */
@-moz-document domain("discord.com") {
/* Insert code here... */
:root{
--red7: mod1;
--red1: mod2;
--red2: mod3;
--red3: mod4;
--red4: mod5;
--red5: mod6;
--red6: mod7;
--pink0: base1;
--pink1: base2;
--pink2: base3;
--pink3: base4;
--pink4: base5;
--pink5: base6;
--pink6: base7;
--pink7: base8;
--pink8: base9;
--pink9: base10;
--gold1: accent-color;
}
.theme-dark {
--header-primary: #000;
--header-secondary: var(--red1);
--text-normal: #353535;
--text-muted: #202122;
--text-link: var(--pink1);
--channels-default: #2d2f31;
--interactive-normal: var(--red2);
--interactive-hover: #000;
--interactive-active: #282828;
--interactive-muted: #4d4d4d;
--background-primary: var(--pink2);
--background-secondary: var(--pink3); /* sidebar */
--background-secondary-alt: var(--pink4);
--background-tertiary: var(--pink0);
--background-accent: var(--gold1);
--background-floating: var(--gold1);
--background-mobile-primary: var(--pink5);
--background-mobile-secondary: var(--pink3);
--background-modifier-hover: var(--red5);
--background-modifier-active: rgba(79,84,92,0.24);
--background-modifier-selected: var(--red4);
--background-modifier-accent: hsla(0,0%,100%,0.06);
--background-mentioned: #ead49747;
--background-mentioned-hover: rgba(250,166,26,0.08);
--background-message-hover: var(--red6);
--background-help-warning: rgba(250,166,26,0.1);
--background-help-info: rgba(0,176,244,0.1);
--scrollbar-thin-thumb: var(--red3);
--scrollbar-thin-track: var(--pink3);
--scrollbar-auto-thumb: var(--red3);
--scrollbar-auto-track: var(--pink3);
--scrollbar-auto-scrollbar-color-thumb: #202225;
--scrollbar-auto-scrollbar-color-track: #2f3136;
--elevation-stroke: 0 0 0 1px rgba(4,4,5,0.15);
--elevation-low: 0 1px 0 rgba(4,4,5,0.2),0 1.5px 0 rgba(6,6,7,0.05),0 2px 0 rgba(4,4,5,0.05);
--elevation-medium: 0 4px 4px rgba(0,0,0,0.16);
--elevation-high: 0 8px 16px rgba(0,0,0,0.24);
--logo-primary: #ff663a;
--focus-primary: #00b0f4;
--radio-group-dot-foreground: #e14410;
--guild-header-text-shadow: 0 1px 1px rgba(0,0,0,0.4);
--channeltextarea-background: var(--pink6);
--activity-card-background: #1dd52e;
--textbox-markdown-syntax: #2d2f31;
--deprecated-card-bg: rgba(32,34,37,0.6);
--deprecated-card-editable-bg: rgba(32,34,37,0.3);
--deprecated-store-bg: #36393f;
--deprecated-quickswitcher-input-background: #72767d;
--deprecated-quickswitcher-input-placeholder: hsla(0,0%,100%,0.3);
--deprecated-text-input-bg: rgba(0,0,0,0.1);
--deprecated-text-input-border: rgba(0,0,0,0.3);
--deprecated-text-input-border-hover: #040405;
--deprecated-text-input-border-disabled: #202225;
--deprecated-text-input-prefix: #2d2d2d;
}
.wrapper-1BJsBx.selected-bZ3Lue .childWrapper-anI2G9, .wrapper-1BJsBx:hover .childWrapper-anI2G9 {
color: #fff;
background-color: var(--gold1);
}
.theme-dark .headerNormal-T_seeN {
background-color: var(--pink7);
}
.theme-dark .body-3iLsc4, .theme-dark .footer-1fjuF6 {
background-color: var(--pink8);
color: hsla(0,0%,100%,.8);
}
.theme-dark .uploadModal-2ifh8j {
background-color: var(--pink9);
-webkit-box-shadow: 0 0 0 1px rgba(32,34,37,.6),0 2px 10px 0 rgba(0,0,0,.2);
box-shadow: 0 0 0 1px rgba(32,34,37,.6),0 2px 10px 0 rgba(0,0,0,.2);
}
.theme-dark .footer-3mqk7D {
background-color: var(--pink6);
-webkit-box-shadow: inset 0 1px 0 rgba(47,49,54,.6);
box-shadow: inset 0 1px 0 rgba(47,49,54,.6);
}
.theme-dark .autocomplete-1vrmpx {
background-color: var(--pink3);
}
.theme-dark .selected-1Tbx07 {
background-color: var(--red4);
}
.newMessagesBar-265mhP {
background-color: var(--red1); /* unread messages bar*/
}
.lookFilled-1Gx00P.colorGreen-29iAKY {
color: #fff;
background-color: var(--gold1);
}
.theme-dark .container-1If-HZ, .theme-dark .reactors-Blmlhw {
background-color: var(--pink7);
}
.theme-dark .scroller-1-nKid {
background: var(--pink4);
}
.theme-dark .reactionSelected-1pqISm {
background-color: var(--red1);
}
.circleIconButton-1QV--U {
color: var(--red7);
background-color: var(--background-primary);
}
.circleIconButton-1QV--U.selected-1JjBPm {
color: #fff;
background-color: var(--gold1);
}
.theme-dark .root-1gCeng {
background-color: var(--pink2);
-webkit-box-shadow: 0 0 0 1px rgba(32,34,37,.6),0 2px 10px 0 rgba(0,0,0,.2);
box-shadow: 0 0 0 1px rgba(32,34,37,.6),0 2px 10px 0 rgba(0,0,0,.2);
}
.theme-dark .footer-2gL1pp {
background-color: var(--pink4);
-webkit-box-shadow: inset 0 1px 0 rgba(47,49,54,.6);
box-shadow: inset 0 1px 0 rgba(47,49,54,.6);
}
.checkbox-3kaeSU .checkboxInner-3yjcPe .checkboxElement-1qV33p:checked+span {
background-color: var(--red7);
border-color: var(--red1);
}
#app-mount > div.layerContainer-yqaFcK > div.backdrop-1wrmKB.withLayer-RoELSG{
opacity: 0.85;
background-color: rgb(53, 37, 37) !important;
}
.theme-dark .container-1D34oG {
background-color: var(--background-primary);
}
}