Change the color of Discord - black and white is boring!
Discord Color Theme by frozenmango747
Details
Authorfrozenmango747
LicenseNo License
CategoryDiscord
Created
Updated
Size6.4 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
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);
}
}