Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
2 contributors

Users who have contributed to this file

@AlexFlipnote @codepupper
70 lines (56 sloc) 2.98 KB

Discord_Theme, Documentation

( Theme created by AlexFlipnote#0021 & CyberRonin#5517 )


Installing plugins

To install plugins to autotheme.css, you must use @import. More information can be found Here
Example:
Preview

You can also install the theme by using the INSTALL.bat that is located in the root folder. By using it, you agree to it installing all needed things listed below:

  • Chocolately
  • Python (latest)
    • beautifuldiscord

The installer will also make a new folder in your Documents called DiscordTheme. Inside there you will find a new file called autotheme.css You can customize the file however you want, save it and see the changes happen instantly to your Discord client.

Making a plugin

By making a plugin to AlexFlipnote/Discord_Theme, you agree that your file will be used and owned by Discord_Theme, you can by any will, add credits to your work. All plugins have to be in .scss format, meaning you're not allowed to use anything else, that includes just normal .css

Remember that everything you make must be documented in Plugins.md to provide easier access for users who wish to use either our or your creation.


Colour usage

In our theme, we have a global variable called :root, it can be found similar to this

:root {
  /*--<var>: <value>*/
  --accent: #7a78bd;
  --dark-primary: #212121;
  --dark-secondary: #303030;
}

Usage:

#user-profile-modal .header {
  background-color: var(--dark-primary);
  background-image: none;
}

Having global variables makes colours easier to change, rather than changing one by one. This might not be supportive when it comes to browsers ( Tested & works on: Chrome, Firefox )


Freeze time to grab CSS

There's a command you can use in console to freeze time and grab CSS from menus:

setTimeout(function(){debugger;}, 5000);

With this, you don't have to worry about finding those things that disappears if you just click away for a second.

Discord version

The CSS code is made to fit the current code of Discord Canary, which is an early version of Discord, if you wish to download Canary, click on one of these links:
Windows Mac Linux.deb Linux.tar.gz

Source-Code Information

This CSS code is 100% self-made, if you do wish to use this code for your creation, please do, just remember to give proper credits to this theme.

Using this theme in any YouTube videos, Screenshots or any other sharing platforms is totally fine. We respect the ability to share experience with everyone else.

You can’t perform that action at this time.