Skip to content

Spotify change accent color by Rickyyyie

Details

AuthorRickyyyie

LicenseMIT

Categoryspotify

Created

Updated

Size2.5 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Change the spotify accent color

Notes

Userstyle doesn't have notes.

Source code

/* ==UserStyle==
@name         Spotify change accent color
@description  Change the spotify accent color
@namespace    open.spotify
@version      0.1.2
@author       Rickyyyie <rickhammen@gmail.com> (https://github.com/rickyyyie)
@homepageURL  http://github.com/
@supportURL   http://github.com/rickyyyie
@license      MIT
@preprocessor default

@var select accent "Accent color" {
 "Red": "#F44336",
 "Pink": "#E91E63",
 "Purple": "#9C27B0",
 "Deep purple": "#673AB7",
 "Indigo": "#3F51B5",
 "Blue": "#2196F3",
 "Light blue": "#03A9F4",
 "Cyan": "#00BCD4",
 "Teal": "#009688",
 "Green": "#4CAF50",
 "Light green": "#8BC34A",
 "Lime": "#CDDC39",
 "Yellow": "#FFEB3B",
 "Amber": "#FFC107",
 "Orange": "#FF9800",
 "Deep orange": "#FF5722",
 "Brown": "#795548",
 "Grey": "#9E9E9E",
 "Blue grey": "#607D8B",
 "Original": "#1ed760",
 "Custom": "var(--color-select, none)",
 "None": "#0000"
}

@advanced color color-select "Custom color" #E67E22
==/UserStyle== */
@-moz-document domain("spotify.com") {
    * {
        --text-bright-accent: var(--accent) !important;
        --essential-bright-accent: var(--accent) !important;
    }
    .encore-dark-theme .encore-bright-accent-set {
        --background-base: var(--accent) !important;
        --background-highlight: var(--accent) !important;
        --background-elevated-base: var(--accent) !important;
        --background-elevated-highlight: var(--accent) !important;
        --background-elevated-press: var(--accent) !important;
        --background-tinted-base: var(--accent) !important;
        --background-tinted-highlight: var(--accent) !important;
        --background-tinted-press: var(--accent) !important;
    }
    button[aria-pressed='true'] svg,
    button[aria-checked='true'] svg,
    .KVKoQ3u4JpKTvSSFtd6J.OF_3F0SQCsBtL1jSTlTA:not([disabled]):focus,
    .KVKoQ3u4JpKTvSSFtd6J.OF_3F0SQCsBtL1jSTlTA:not([disabled]),
    .qLjIx_SzBEpDRA_q7kxQ {
        color: var(--accent) !important;
    }

    button[aria-pressed='true']::after,

    .DFtdzavKSbEhwKYkPTa6 .DuvrswZugGajIFNXObAr .epWhU7hHGktzlO_dop6z,
    .DFtdzavKSbEhwKYkPTa6 .TywOcKZEqNynWecCiATc:focus .epWhU7hHGktzlO_dop6z,
    .DFtdzavKSbEhwKYkPTa6 .TywOcKZEqNynWecCiATc:hover .epWhU7hHGktzlO_dop6z,
    .DFtdzavKSbEhwKYkPTa6:focus-within .epWhU7hHGktzlO_dop6z,
    input:checked:not([disabled], :active) ~ .Js64TOfWtHksI6TQ6knT {
        background: var(--accent) !important;
    }
    .control-button--active {
        fill: var(--accent) !important;
        color: var(--accent) !important;
    }
}

Reviews

No reviews yet.