Skip to content

catppuccin/youtubemusic

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

78 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

Logo
Catppuccin for Youtube Music

Previews

🌻 Latte
πŸͺ΄ FrappΓ©
🌺 Macchiato
🌿 Mocha

Usage

  1. Create a new css file with one of the flavour imports below.
  2. Assuming you have the latest build with the theme selection menu, open the app, click Options > Visual Tweaks > Theme > Import custom CSS file, and choose the CSS file.
  1. Create a new css file with one of the flavour imports below.
  2. Navigate to Settings > Appearance and enable Custom CSS
  3. In Custom CSS file path, choose the CSS file you created.

The code (flavor imports)

/* latte */
@import url("https://youtubemusic.catppuccin.com/src/latte.css");
/* frappe */
@import url("https://youtubemusic.catppuccin.com/src/frappe.css");
/* macchiato */
@import url("https://youtubemusic.catppuccin.com/src/macchiato.css");
/* mocha */
@import url("https://youtubemusic.catppuccin.com/src/mocha.css");

/* if you want to change the accent color, paste this in aswell and change the hex code - or use one of the predefined colors with var(--ctp-'color') - e.g. var(--ctp-maroon) */
html:not(.style-scope) {
    --ctp-accent: #f5e0dc !important;
}
  1. Install Stylus extension for Firefox, Chrome or Opera
  2. Then install with Stylus (click on the link):
  1. Choose your flavor and accent color in the Configure window in Stylus Options

Overriding Colors

If you wish to change the default colors, do the following:

Change the respective colors in the css file you chose to the values you need, for example:

    --ctp-base: #020202;
    --ctp-crust: #010101;
    --ctp-mantle: #000;
/* OLEDpuccin*/

Paste the modified colors at the end of your theme of choice (ytmdesktop), or within html:not(.style-scope) (Stylus):

    --ctp-base: #020202; !important;
    --ctp-crust: #010101; !important;
    --ctp-mantle: #000; !important;
/* OLEDpuccin */

You can find the references to the available colors you can change in the beginning of any theme CSS file.

πŸ’ Thanks to

Current maintainer

Contributions

Previous maintainer

Β 

Copyright Β© 2021-present Catppuccin Org