Custom variables to color schemes

feature
1

I think a feature where we could add custom css variables to color schemes would be useful.

My use case is that I have a custom header at my forum want our company logo to be blue in light color scheme and white in the dark color scheme. Given that there’s no way to write CSS which targets a specific color scheme, I don’t see how I can do this currently. What I could do is to have separate dark and white theme, but then I lose the ability to use the automatic dark mode, which can only switch color scheme and not theme.

Alternatively, just having some css class in html or body indicating the selected color scheme would also solve this issue since I could write css targetting the specific color scheme.

1 Like
2

If you just need to address the logo, there’s dedicated slots for dark scheme logos on the backend settings:

image
image726×617 8.23 KB

1 Like
3

You can have CSS that behaves differently in light/dark mode if that helps — we have a special stylesheet called color_definitions… there’s an example of how you might use that here: Why might dark-light-choose() not work? - #2 by awesomerobot

6 Likes
4

Thanks didn’t know that you can already do that, that’s exactly what I needed! Dark theme logo is a good points as well, didn’t know that existed.

1 Like