Menu
it there a way to make the HTML elements be in dark mode
if the user has activated in his system "dark mode"
and if the user is like to use standard colors, to be "light mode"
all this automatically when the user opens the website. without any buttons.
and I want that if the user changes the theme color preference from the setting, it will automatically switch to the correct one directly without refreshing the page.
the black and white color of text, I want that don't use any CSS
so not using CSS. in this project I am using only HTML.
<!-- here is example of tags to color automatically for the answer -->
<h1>
<span>hello world<span>
<input>
if there a way to do this with one line or 2 maximum.
maybe adding a library with no configuration needed, but I don't find it
add this CSS property color-scheme: light dark; to the <html> css selector (is only one line of css)
OR if you need only html you can use this <meta> tag
<meta
name = "color-scheme"
content = "light dark"
/>
https://developer.mozilla.org/en-US/docs/Web/CSS/color-scheme
watch this youtube video for more details: https://youtu.be/n3lcjY4Mm00
it does all the things you listed before!
<html>
<head>
<meta name="color-scheme" content="light dark">
</head>
<body>
<h1>hello world</h1>
<span>hello world</span>
<input type="text" placeholder="hello world">
</body>
</html>
196
answered Jul 17 '26 07:07
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With