by Max Barry

Latest Forum Topics

Advertisement

17

DispatchMetaReference

by The Meowvellous Wonderful World of Valentine Z. . 369 reads.

Valentine Z's Guide to Correct Background and Text color choices.

While calling it out as a cliche, I figured that I will help people with this. Using colored texts that adapt and screws over either light or dark theme users.

I'm not calling out anyone in particular, don't worry! We all love colors, who doesn't? With that said, there are certain loopholes that will help everyone.

TL;DR Rule of Thumb: If you're using a light background, use #000001 for text. If you're using a dark background, use #FFFFFE for text.

Dark background, One-Step White.
Light background, One-Step Black.

*** This was first written for the forums, so in Dispatch, it will look like some things look in the opposite manner as described. However, it still works as intended.

For Dark Theme users, consider this:
This text is near unreadable on the dark theme, because the BBCode auto adjusts it. For the light theme users, however, this is perfectly legible.

I'm not sure about the technicalities involved, but for dark theme, Pure White will be converted into Pure Black, and hence the horror above. How do we fix this without changing it drastically? Simple! Use "One-Step White". Color code is #FFFFFE (that's 255, 255, 254 in RGB). There's one less blue, but to our eyes, it's very unnoticeable.

This #FFFFFE text fares better. Give it a try on both light and dark theme. It works on both! Woo-hoo!


The opposite could happen to light theme users. Consider this:

This text is near unreadable on the light theme, because the BBCode auto adjusts it. For the dark theme users, however, this is perfectly legible.

Oof, pretty bad, right? You tried to use black text on a dark background and this works fine for dark theme users, but this screws up the light theme users. Again, One-Step White to the rescue!

This text is perfectly readable on both themes. Woo-hoo!


The reverse applies if you are using a light background, like... maybe consider light blue.

This text is perfectly readable on dark themes. For light-theme users, this strains your eyes! ><

This is simply the case of the forums doing the work for you. For dark theme users, this is fine, because it is black over cyan background. For light theme users, they have the horror of having an eye strain. For this case, use One-Step Black! (#000001) (0, 0, 1 in RGB).

This text is perfectly readable on both themes! Nice!


This can also screw up dark theme users too, ooooh!

This text is perfectly readable on light themes. For dark-theme users, goodness help you highlighting the words! ><

One-Step Black that text!

This text is perfectly readable on both themes! Excellent!


This can also help with sig formatting, as I helped a friend last time. AFAIK, this only affects dark theme users.

------------
------------
------------
------------

Oh no! If you're on Dark Theme, you will see these horrid little dashes that made up the flag tri-color! This works great for light theme users, wheeeew. You don't want those, right? Worry not! For black and white, just use One-Step Blacks and Whites respectively.

------------
------------
------------
------------

HUZZAH, now you have a neat flag thing!


RawReport