Skip to content

MiniDiscordThemes/Demonstration

Repository files navigation

Demonstration Discord Theme

Buy me a coffee on ko-fi CSS GitHub downloads Asar GitHub downloads Total repository size

A Discord theme for demonstrating Discord themes.

Demonstration banner

Demonstrating themes in dark mode Demonstrating themes in light mode
Synthesis dark mode Ninex light mode
Tritone dark mode Neobrutal light mode

Installation

Install a client mod, then follow the instructions below.

Click to expand
  1. Download Demonstration.theme.css:
  2. Place the file in the themes folder:
    • Settings > BetterDiscord > Themes > Open Themes Folder
  3. Toggle on the theme card.
Click to expand

Automatic

  1. Click to install:

Manual

  1. Download net.saltssaumure.Demonstration.asar:
  2. Place the file in the themes folder:
    • Settings > Replugged > Themes > Open Themes Folder
  3. Click Load Missing Themes and toggle on the theme card.
Click to expand

Local

  1. Download Demonstration.theme.css:
  2. Place the file in the themes folder:
    • Settings > Vencord > Themes > Local Themes > Open Themes Folder
  3. Click Load missing Themes and toggle on the theme card.

Online

  1. Paste the link in Settings > Vencord > Themes > Online Themes:
    • https://minidiscordthemes.github.io/Demonstration/Demonstration.theme.css

Customisation

To edit the following variables, follow the instructions for your client mod.

Variable Description Valid values Default value
--demo-font-variant Font style for censored text Circular or Rounded or Block Circular
--demo-font-emoji Font style for emojis Noto or none Noto
--demo-text Toggle text censor censor or normal censor
--demo-clientmod Toggle client mod element visibility visible or hidden visible
--demo-emoji-radius Corner rounding for emojis Any length 4px
--demo-emoji-opacity Opacity for emojis 0 to 1 0.5
--demo-icon-hue Hue for icons, emojis, badges 0 to 360 240
--demo-image-hue Hue for image attachments 0 to 360 270
--demo-banner-hue Hue for server banners 0 to 360 180
--demo-self-hue Hue for your own avatar 0 to 360 300

BetterDiscord

Click to expand
  1. Open Settings > BetterDiscord > Themes.
  2. Click the pencil icon on this theme.
  3. Edit the variable values and save changes.

Replugged

Click to expand
  1. Enable Automatically Apply Quick CSS in Settings > Replugged > General.
  2. Open Settings > Replugged > Quick CSS.
  3. Copy and paste lines 15-27 of Demonstration.theme.css.
  4. Edit the variable values and save.

Vencord

Click to expand

Local

  1. Open Themes Folder in Settings > Vencord > Themes > Local Themes
  2. Open Demonstration.theme.css with your favourite text editor.
  3. Edit the variable values and save.

Online

  1. Enable Custom CSS in Settings > Vencord > Vencord and click Open QuickCSS File.
  2. Copy and paste lines 15-27 of Demonstration.theme.css.
  3. Edit the variable values.

License

MIT License

  • TL;DR;NAL: Do whatever you want with this theme, just include the original license.

Credits

Questions or suggestions?