xSF

Author Topic: How to make xSF Forums visually appealing! [Dark Theme]  (Read 775 times)

0 Members and 1 Guest are viewing this topic.

Armionus

Hello xSF!

Have you ever wondered that the current white theme, while doesn't look bad, some elements are out of place? For example the staff logos, that are created in a dark style, are more suitable for a dark theme? Look no further, I'm showing you a way that can not only completely reforms how the forum looks visually, but your whole browsing experience. The bonus is that it can be pleasant on your eyes.

First off, let's see how it looks:




Not bad at all, right?

Now for the method. This is a browser extension that is called 'Dark Reader'. It's compatible with Mozilla, Chrome and Safari and can be found here.

A simple step-by-step guide how you can have the same experience yourself:
  • Click on the link above.
  • Click on the browser at the website you want to install this on.
  • Install the extension by clicking on 'Add to FireFox/Chrome/Safari.
  • When you see a pop-up that looks similar below, click on 'Add'.


It has multiple features that include:
  • A simple toggle to turn the dark theme on and off
  • You can adjust the brightness that is completely independent from the brightness setting on your screen.
  • A sepia filter.
  • You can change the thickness of the characters and more.
I have tried multiple extensions to create a dark theme on my browser, this is the one that worked the best. Now this doesn't come without any cons neither. Some elements of various websites become hard to read or get a weird color-text combination. I believe this is due to an incompatibility between the codes through which the element is designed and the algorithm behind Dark Reader

Why is a dark theme good for you besides the visuals?
  • It's easier on the eyes under certain conditions. These conditions are a dark enviroment where the biggest and most often the only source of light is your screen. In sunny and light conditions, it can have the opposite effect and put unnecessary strain on your eyes. Always try to match the brightness and contrast of your enviroment.
  • It reduces the exposure of blue light. While in daytime it makes things easier to see and read on a screen, at night it's one of your worst enemies. It decreases the production of the sleep hormone melatonin, which makes you feel sleepy. It tricks your brain into thinking that it's daytime and you should not sleep yet (A survival instinct). It disrupts your Circadian rhythm and internal clock which negatively affects your general health. Read more about this here.
  • In case you have a smartphone with an OLED (Super Amoled, P-OLED etc.) screen (like Samsung for example), a black (dark is not enough, it has to be black for the most part). The reason for this is that screen is the biggest battery hog of all. OLED screens can turn off pixels individually if it has a black color, thus a black theme can decrease consumption and increase battery life. Read more about it here. Of course the most effective solution would be to cut off digital electronics hours before you sleep, but it's close second.
    Fortunately Samsung's Internet Browser on android has an integrated night mode that does the same thing. The best thing is that it's globally available on the Play Store, is not exclusive to Samsung smartphones.
  • I go a step further and change the color temperature of my screen to a warmer tone in darker enviroments, as well as during night. This further reduces the exporuse to blue light as well as the strain on my eyes.
    I accomplish this on Windows with the help of a software called f.lux. It changes the color temperature to a specified value (1900K-6500K) and gives an orange tint to your screen. The lower the temperature the stronger the effect. It can also change the temperature automatically when the sun goes down (calculated by location) and reverts when it rises.
    On Android I use an app called cf.lumen. It also can be automated for the sun's cycle, but it's widely customizable. I almost drown myself in the many options it provides. The best part of it that it doesn't change the contrast and reduce the quality of the image, however it requires root priviliges to do so. Without root, it's almost the same as any other apps that are designed for this.
If you have any questions, let me know below.
« Last Edit: March 15, 2019, 12:37:08 pm by Armionus »


Camora

Reply #1 on: March 15, 2019, 12:52:38 pm
Thanks for this detailed guide
you watched my descent, now watch my rising -xSF 2019


Akira

  • Management
  • Legend
  • *
  • Posts: 1,571
  • Total likes: 566
  • Gender: Male
  • Schneller, besser, stärker als der Rest.
    • View Profile
Reply #2 on: March 15, 2019, 12:54:08 pm
My eyes feel better now, huge thanks!


Farouk

Reply #3 on: March 15, 2019, 12:58:21 pm
Perfect, thanks.


Soviet

  • Lead Admin
  • Legend
  • *
  • Posts: 1,071
  • Total likes: 56
  • Gender: Male
  • I'm a Russian, I love Vodka
    • View Profile
Reply #4 on: March 15, 2019, 01:41:38 pm
Thanks, Now i'll have to turn on my light to see instead of browsing the XSF forum.


Deanen

Reply #5 on: March 15, 2019, 02:27:15 pm
I never felt this comfortable, especially while using f.lux and the Dark Reader.

Thank you so muc, I apprecite it  :love3:
STAY LOW MOVE FAST KILL FIRST DIE LAST ONE SHOT ONE KILL NO LUCK PURE SKILL.
 


Prodigy

  • Member
  • ***
  • Posts: 225
  • Total likes: 37
  • Gender: Male
  • Why are you watching my profile?
    • View Profile
Reply #6 on: March 15, 2019, 02:35:45 pm
Finally, Thank you for the guide.

EDIT: Admin and Retired Staff color is same ?
« Last Edit: March 15, 2019, 02:37:41 pm by Prodigy »

I'm gayer than James Charles, sister!


Armionus

Reply #7 on: March 15, 2019, 08:15:14 pm
Finally, Thank you for the guide.

EDIT: Admin and Retired Staff color is same ?

Yeah, it switches up some colors to make them pop out and easier to read while maintains others. It's a fair compromise you can make if you want to use this extension for what it is for.


BillaTM

Reply #8 on: March 15, 2019, 11:14:15 pm
Wow, thank you @Armionus  :smoke:


TersloK

Reply #9 on: March 15, 2019, 11:21:14 pm
Nice!


Splash_



Dann.

Reply #11 on: March 16, 2019, 07:47:57 am
Thanks actually helpful


Supreme.

  • Admin
  • Senior Member
  • *
  • Posts: 796
  • Total likes: 152
  • Gender: Male
  • Change the game, don't let the game change you.
    • View Profile
Reply #12 on: March 16, 2019, 09:58:58 am
Thank you for the guide, Armi. Now it looks better.  :thumbsup3:


ZeroDeathZ

Reply #13 on: March 16, 2019, 11:49:24 am
That's a good idea. But bad for members having a dark transparent signature. But having a new forum theme would be much better.


GreffenWood

Reply #14 on: March 16, 2019, 01:44:06 pm
Such a great idea, the forum looks cool and more better now. However, I can easily customize the forum settings, thank you so much for this guide buddy!
Keep fear to yourself, share courage with others.
Don't be the perfect one, be the right one.