Catppuccin for Youtube Music

Previews

🌻 Latte

🪴 Frappé

🌺 Macchiato

🌿 Mocha

Usage

Youtube Music Desktop App (th-ch)

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.

Youtube Music Desktop App (ytmdesktop)

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;
}

Stylus

1. Install Stylus extension for Firefox, Chrome or Opera
2. Then install with Stylus (click on the link):

• 🎧 Catppuccin for Youtube Music

3. 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:

For Youtube Music Desktop App (th-ch)

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*/

For Youtube Music Desktop App (ytmdesktop) or Stylus

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

• kerichdev

Contributions

• Anubis
• OceanicSquirrel
• jh-devv

Previous maintainer

• rubyowo

 

Copyright © 2021-present Catppuccin Org