Set color-scheme by default about emmet

[sergeche]

I’m not sure if it’s something that must be added by default. I did some quick test and found that this @media only works with bare HTML page without styling. Adding background and color to :root selector forces given colors regardless of user theme. So this @media rule will fix something for unstyled pages only, which doesn’t looks real production page. Or maybe you can provide some good examples when this snippet actually provides a good styling by default?

Also, I believe that a proper dark theme or default font face is something that should be provided by developer, not a default. And Emmet allow developers to customize snippets

[jimmywarting]

Or maybe you can provide some good examples when this snippet actually provides a good styling by default?

Think my jsfiddle is sufficient.

when you use color-scheme: dark then you will style the calendar widget that you can't solve with any other css selector

and this is what it would look without it:

so it's more than just default background/text color that gets applied.
And there is many styled/production ready websites that still uses native form inputs for instance.
radio boxes can still go unstyled. you get the more system OS looks and feel to them

[sergeche]

IMO on second screenshot it matches better the default page UI. I’m not convinced such CSS should be default for simple HTML skeleton.

[jimmywarting]

i haven't tried to style the page at all.

[jimmywarting]

ok, turned out that you can set a meta tag as well.

<meta name="color-scheme" content="dark light">

this is actually better.

a full demo of all element is here: https://color-scheme-demo.glitch.me/
and a blog about it: https://web.dev/color-scheme/ explaining why it's a good choice to have it