Posted by [FREE] SITEWIDE Low contrast dark mode CSS!

tricks (autistic,
thankfully) (#175516)

Toxic
View Forum Posts


Posted on
2024-06-01 22:42:48
I made a low contrast dark css for the whole site! I personally found the night mode far too bright for my tastes, being sensitive to light, so I decided to make a low contrast dark css for the whole site! I built it from scratch myself and (after much struggling with inspect element, testing, and breaks bc of burnout) I finally finished!

First thing's first though, I'd like to give HUGE thanks to River @#34 for the inspiration! Their sitewide minty dark mode css was the primary source of inspiration for this, so please check out their css too!

Also, I'd like to thank katie @#106445 for their tutorial which taught me how to make this in the first place!

I made 7 color variants! There's some gaps in the code, like in the cub survival bar, but I can't change the bg of that particular bar without blacking out the hunting grid. Most of the CSS I used to make this, I learned by picking the site apart with inspect element, so I don't know a whole lot about css to be of much help re: bug fixes I'll still try if ya ask, though!

Instead, I'm giving everyone permission to edit the css as you wish! My only caveat is that you need to keep the credit intact and you can't charge money for the css posted as a result. I made this as an accessibility tool, and I don't want it locked behind a paywall.

To use this, you'll need a browser extension that allows you to create/use your own custom css for websites! I use stylus, personally. If you do use stylus, all you need to do is paste the entire code into the main body and hit "overwrite style"!
Stylus for google chrome | Stylus for firefox

ALSO make sure you go to settings and change the site theme to night! The css for the different themes are very different, so these themes won't work with the other built-in site themes!

EDIT: If you have a hard time seeing ping colors in chat, try disabling pings! Each theme has it's own custom ping color.

THE CSS:

red


orange


yellow


green


blue


purple


pink



Hrt Icon 19 players like this post! Like?

Edited on 02/06/24 @ 07:21:48 by tricks (autistic, thankfully) (#175516)

tricks (autistic,
thankfully) (#175516)

Toxic
View Forum Posts


Posted on
2024-06-02 00:14:43
damnit, just noticed a section I missed in all of my checking gimme a sec to fix it.

Edit: forgot to say this earlier but its been fixed! Sorry about that!



Hrt Icon 0 players like this post! Like?


Edited on 02/06/24 @ 15:20:18 by tricks (happily autistic)🏳️‍⚧ (#175516)

clip (#14162)

Sapphic
View Forum Posts


Posted on
2024-06-06 10:47:36
this is awesome, thanks for making a bunch of different colour options as well! <3



Hrt Icon 0 players like this post! Like?

tricks (autistic,
thankfully) (#175516)

Toxic
View Forum Posts


Posted on
2024-06-06 10:49:04
No problem! I wanted this to be an accessibility tool, so multiple color options ensured that everyone could use them!



Hrt Icon 0 players like this post! Like?

ShaydeWanderer
[He/They/She] (#171201)

Sapphic
View Forum Posts


Posted on
2024-06-06 10:52:47
Edit: Nvm



Hrt Icon 0 players like this post! Like?


Edited on 06/06/24 @ 11:00:48 by ShaydeWanderer [He/They/She] (#171201)

Crowley (0/100 GB) (#440456)

Wicked
View Forum Posts


Posted on
2024-08-26 02:25:30
OH it's beautiful, you're an angel <333333



Hrt Icon 0 players like this post! Like?

Dazedlion (#229933)

Wanderer
View Forum Posts


Posted on
2024-09-25 17:08:33
this is so cool! I just wish my den css worked with it too lol



Hrt Icon 0 players like this post! Like?

kate !! (#489909)

King of the Jungle
View Forum Posts


Posted on
2024-10-18 10:32:02
for anyone wondering how to get their den CSS to work with this:

paste the den CSS (not the URL) into stylus in the same way you did this one. it works, i've done it! a tip, since some den css is hard to read everywhere on the site, i did my den CSS and then layered this dark mode over top of it (make a separate new style in stylus and simply have them both enabled for this!) so that i have my den CSS background but the dark mode box to make things easy to read!



Hrt Icon 1 player likes this post! Like?

Dazedlion (#229933)

Wanderer
View Forum Posts


Posted on
2024-10-19 01:36:00
gah tysmm Ive been dying to know!



Hrt Icon 0 players like this post! Like?

Marcellium ☀️
(G2 Smilus) (#100952)

Phoenix
View Forum Posts


Posted on
2024-11-22 08:54:11
This is awesome! Thank you so much for making these. I Need dark modes to be able to see properly and this is so much better!



Hrt Icon 0 players like this post! Like?







Memory Used: 626.76 KB - Queries: 2 - Query Time: 0.00104 - Total Time: 0.00535s