<!DOCTYPE html>
<html>
<head>
<style>
html {
content: ""; /* (ab)using the content property */
}
/* Light mode */
@media (prefers-color-scheme: light) {
html {
background-color: white;
}
}
/* Dark mode */
@media (prefers-color-scheme: dark) {
html {
background-color: black;
}
}
</style>
</head>
<body></body>
</html>
Don’t think of code. This code actually takes system theme. And, set it to website. But, I was wondering why it wasn’t working for me. I am currently using Manjaro. I am using dark Adwaita-dark.
I don’t know if above code detects Chrome’s dark theme or not. I am using Dark theme in Chrome also. I usually downloaded dark theme for Chrome from chrome extension. Although, why the code is selecting light theme for my system? Is there any other way to select dark theme
Browser themes do not control what the prefers-color-scheme CSS media selector will return, just how the UI of the browser will appear.
In the meantime I add --force-dark-mode to the end of my Chrome/Chromium-based browser application shortcut to force the browser to use prefers-color-scheme: dark. Note it will only work for you. Anyone else visiting your site from a Chrome/Chromium browser on Linux will need to do the same to see your dark theme until the bug is fixed.
after we can add some options in this file … for example:
cat ~/.config/chromium-flags.conf
# This line will be ignored.
--start-maximized
--enable-features=OverlayScollbar
--disable-search-engine-collection
--enable-gpu-compositing
--enable-accelerated-video-decode
--use-gl=desktop
--force-dark-mode
after you can load chromium without option (from gui) but chromium use config(s) in this file
