# DiscordCSS
A collection of my Discord CSS styles

## Using these themes
All of these themes are written in SCSS instead of CSS, so you will have to compile them first. To
compile SCSS code into CSS, I suggest you use the commandline tool you can find [on the official Sass site](http://sass-lang.com/dart-sass).

As for loading the CSS themes into Discord, I recommend using [BeautifulDiscord by leovoel](https://github.com/leovoel/BeautifulDiscord).
It's a great tool that allows hot-reloading custom CSS in Discord, and doesn't have the security risks that come with
BetterDiscord (which I advice you not to use). Instructions to install it can be found in its repository.

**NOTE**: These styles are meant to work with the **Dark** Discord theme. If you use the White theme, please switch to
Dark if you don't like looking at a broken mess.

## Themes

### Custom Configurations
Because these themes are meant to be very configurable, it's easy to create your own configuration with the settings 
you prefer. Below, you can find an example of a configuration that I use (at the time of writing) where various extra
options are enabled.

Path: `personal.scss`

![Custom configuration screenshot](https://uwaa.moe/i/XHUAGXG)

![member list](https://thumbs.gfycat.com/FatherlyTinyIberianlynx-size_restricted.gif)
![channel list animations](https://thumbs.gfycat.com/WeakJampackedAquaticleech-size_restricted.gif)
![unread server](https://thumbs.gfycat.com/SardonicWhirlwindHydatidtapeworm-size_restricted.gif)
![code blocks logos](https://uwaa.moe/i/AR4yQZW)

### Sakura
A pink style, inspired by cherry blossoms.

Path: `sakura/main.scss`

![Sakura theme screenshot](https://uwaa.moe/i/AQHYbJH)