Skip to content
This repository has been archived by the owner on Jan 14, 2022. It is now read-only.

Setup Guide

Jump to bottom
TakosThings edited this page Aug 15, 2021 · 9 revisions

Requirements

  • Windows 10
  • OR the following fonts installed:
    • Segoe UI MDL2 Assets font (minimum version 1.78)
    • HoloLens MDL2 Assets font (minimum version 2.02)

Download

Download the latest version of the theme from releases

ℹ Do not clone or download the source code unless you're working on the theme
ℹ BetterDiscord users must download Metro_for_Discord.theme.css

Install

Follow the install instructions for your platform

Setup

  • Enable Dark Mode in User Settings. Press CTRL + comma if the settings button is missing.
  • (Optional) Turn 'Chat Font Scaling' to 15px

BetterDiscord

BetterDiscord users must ensure they have the following options Disabled

  • Normalise Classes - (Not used by this theme. Causes a problem with codeblocks. See #103)
  • Public Servers - (Broken)

Personalisation

The theme has a variety of options which can easily be modified by editing the CSS file. Note that some options are more complex than others, these will be explained below.

It it recommended you use a good code editor like VSCode, SublimeText, or Notepad++.

Colours

These are the first options presented in the user options section at the top of the CSS file. Note that unlike other themes, colours are represented as three groups of numbers separated by commas (0 , 120, 215). Colours within the :root{} must always be in this format. The numbers are derived from the RGB values instead of the HEX value most themes use. This allows us to do some CSS tricks you can't normally do otherwise.

Accent

Most people will want to set the theme accent colour to be the same as their Windows accent colour.
A chart is available on this wiki of all the accent colours from the Windows 10 Personalisation settings.
The default colour is Default Blue.

Link

This changes the colour of links in chat.
The default colour is Default Blue.

Voice

This changes the colour of the ring around the guild when you are connected to RTC.
The default colour is Turf Green.

Acrylic

Background

You may change the background used for acrylic effects by modifying the URL in the acrylic background option.

Things to know
  • Right click an image and select Copy image address (or your browser's equivalent)
  • The URL must start with https://
  • The URL must be a direct link to the image (the URL will end with a file extension such as .jpg, .png, etc)
  • Animated GIFs kill performance, don't use them
  • The image should be close to your native resolution. The image will be resized automatically to fit the Discord window

Blur Filters

ℹ This option is advanced, and may lead to degraded performance on low-end machines

The default background does not require blur effects, but if you are using your own you may enable blur effects if needed.

  • Uncomment backdrop-filter: blur(45px) saturate(125%); to turn ON the blur effect.
    • blur(45px) to set the blur amount. Higher number = more blur
    • saturate(120%) helps boost colours through the blur filter

Helpful links

  • Imgur is the probably the easiest and most reliable option for uploading backgrounds
  • Wallhaven is an excellent repository of wallpapers, and is quite well organised
    • Use this search to find wallpapers similar to the default one
    • ⚠ Some results may be NSFW even when 'SFW' is the only filter enabled
Clone this wiki locally