Is your question about this theme component that adds a toggle to switch to dark mode, or detecting a dark color palette in general?
There is dark-light-choose.
2 个赞
Thank you for your help
I am using this Dark/Light Mode Toggle component
My question is about detecting which mode I am in and switch the background image so I can have one image for light mode and another for dark mode.
I tried to follow along with the link you posted and also this one
which goes into a little more detail but I did not succeed. I tried adding image files(JPGs) $bg-light and $bg-dark to my theme
I also tried adding a color_definitions.scss stylesheet to my theme with the code in that post
$bg: url(dark-light-choose($bg-light, $bg-dark));
:root {
--custom-bg: #{$bg};
}
I also tried creating a theme on github
like I said, sorry about being a little lost
If I should start a new topic let me know and in what category to put it
Thanks for your help
1 个赞
Moderators can move the posts to a new topic in Dev if needed. I just wanted to make sure that your problem is not directly related to the theme component, but also happens when you activate dark mode via the browser or device settings.
I think you are already pretty close. One thing I noticed is that you use url() twice:
1 个赞
My problem is definitely not related to the theme component
Thanks for the help, sorry for the noise 
Woah… don’t tell anybody, that is my secret sauce for blending two backgrounds together. The first one takes precedence over the next. So, the first one is a linear gradient with half being transparent and the other is a static image 
here is the effect in action
I understood that you use 2 backgrounds.
background-image: linear-gradient(to top, white, 15%, transparent), url(var(--custom-bg));
But isn’t url(var(--custom-bg)) in combination with --custom-bg: #{$bg}; and $bg: url(dark-light-choose($bg-light, $bg-dark)); something like url(url(dark-light-choose($bg-light, $bg-dark)))?
3 个赞
We now offer a dark/light mode toggle in core and have therefore deprecated this theme component. Please see the announcement for more details:
5 个赞