Skip to content
/ discord1 Public
forked from catppuccin/discord

🎮 Soothing pastel theme for Discord

License

Notifications You must be signed in to change notification settings

ttocz/discord1

 
 

Repository files navigation

Logo
Catppuccin for Discord

Discord Theme Preview

Previews

🌻 Latte
🪴 Frappé
🌺 Macchiato
🌿 Mocha

Usage

  1. Download your preferred flavour:
  1. Move the downloaded file into a location of your choosing, for example ~/.config/discord on Linux or %APPDATA%\discord on Windows.

  2. Ensure Discord is running.

  3. Install and run BeautifulDiscord:

# Install using pip
python3 -m pip install -U https://github.com/leovoel/BeautifulDiscord/archive/master.zip

# Run BeautifulDiscord providing the path to your downloaded theme file
# Linux:
beautifuldiscord --css ~/.config/discord/catppuccin-mocha.theme.css

# Windows:
beautifuldiscord --css %APPDATA%\discord\catppuccin-mocha.theme.css
  1. Download your preferred flavour:
  1. Copy the downloaded file to your BetterDiscord themes folder.
  2. Enable the theme in BetterDiscord settings.

Clients/Mods with custom CSS support

  1. Simply add your preferred flavour into Discord > Settings > Custom CSS
/* latte */
@import url("https://catppuccin.github.io/discord/dist/catppuccin-latte.theme.css");
/* frappe */
@import url("https://catppuccin.github.io/discord/dist/catppuccin-frappe.theme.css");
/* macchiato */
@import url("https://catppuccin.github.io/discord/dist/catppuccin-macchiato.theme.css");
/* mocha */
@import url("https://catppuccin.github.io/discord/dist/catppuccin-mocha.theme.css");

/* You can also append Catppuccin colors to customize the accent, e.g. */
/* mocha (pink accent)*/
@import url("https://catppuccin.github.io/discord/dist/catppuccin-mocha-pink.theme.css");
/* frappe (maroon accent) */
@import url("https://catppuccin.github.io/discord/dist/catppuccin-frappe-maroon.theme.css");
  1. Follow the instructions from DiscoCSS to install DiscoCSS.
  2. Use your preferred flavour as your DiscoCSS custom.css
# latte
curl -L https://catppuccin.github.io/discord/dist/catppuccin-latte.theme.css > ~/.config/discocss/custom.css
# frappe
curl -L https://catppuccin.github.io/discord/dist/catppuccin-frappe.theme.css > ~/.config/discocss/custom.css
# macchiato
curl -L https://catppuccin.github.io/discord/dist/catppuccin-macchiato.theme.css > ~/.config/discocss/custom.css
# mocha
curl -L https://catppuccin.github.io/discord/dist/catppuccin-mocha.theme.css > ~/.config/discocss/custom.css

# You can also append Catppuccin colors to customize the accent, e.g.
# mocha (pink accent)
curl -L https://catppuccin.github.io/discord/dist/catppuccin-mocha-pink.theme.css > ~/.config/discocss/custom.css
# frappe (maroon accent)
curl -L https://catppuccin.github.io/discord/dist/catppuccin-frappe-maroon.theme.css > ~/.config/discocss/custom.css
  1. Enable CSP Patching from Stylus Settings > Advanced.
  2. Click here to install
  3. Choose your preferred flavour and accent color from the Stylus preference dropdown.

🙋 FAQ

  • Q: "Can this get my account banned?"

  • A: Using third party clients and injecting custom css is against the ToS. We are not responsible for anything that might happen to your account by using third party clients. Use at your own discretion!

  • Q: "Latte/Light theme doesn't look right!?"

  • A: Using the Latte theme requires Discord's light mode to be on. You can set it up to sync between e.g. Mocha in dark mode, and Latte in light mode with this snippet:

    @import url("https://catppuccin.github.io/discord/dist/catppuccin-mocha.theme.css") (prefers-color-scheme: dark);
    @import url("https://catppuccin.github.io/discord/dist/catppuccin-latte.theme.css") (prefers-color-scheme: light);

💝 Thanks to

 

Copyright © 2021-present Catppuccin Org

About

🎮 Soothing pastel theme for Discord

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • SCSS 96.2%
  • CSS 2.0%
  • JavaScript 1.4%
  • Other 0.4%