Post #2269883

2026-05-09 03:39 UTC

I want to add a light mode to my site but it means I gotta try out javascript again for the first time in like 10 years and I also personally struggle reading in light mode lmao I also want to make sure the colors I choose still fit my site

Replies (2)

@kiru@gay.kiru.gay 2026-05-09 07:15

@neineon77@transfem.social you can achieve this with pure CSS, assuming u merely want it use the browser's preference, i.e, instead of: background: #FFFFFF;you can do: background: light-dark(#FFFFFF, #000000);first argument to the function is the color to use in light mode, and second is the color to use in dark mode, this works in most modern browsers these days if ur using CSS variables you can also merely do a media query and adjust them, i.e: :root { --background: #FFFFFF; } @media (prefers-color-scheme: dark) { :root { --background: #000000; } }and if it's because you want a manual toggle, you can use CSS queries and simply have an somewhere, and apply the dark colors like so (assuming the input has a dark-mode class on it): :root:has(.dark-mode:checked) { --background: #000000; }though keep in mind the toggle's state isn't remembered between refreshes... unless absolutely desired, i would recommend merely following what the browser says it wants, as that's what most users expect

Open ##2269880
@wyatt@soc.megatokyo.moe 2026-05-09 03:57

@neineon77@transfem.social no you dont i did it with symlinks and no javascript

Open ##2920015