Samsung Internet forces dark mode

Question

My website is designed in light mode and not supposed to react to any form of dark mode. This works on all websites, except for Samsung Internet. Whenever I open the website on Samsung Internet, it automatically swaps out the white background for a dark one, and changes the letter colors to white. Does anyone know how to fix this?

Symphonic

Samsung even go as far as inverting and changing colours in images. Great for the user, but websites can look really odd at times. – Linell

Answer 1

According to article on Samusung's developer blog there's actually a way to prevent this using prefers-color-scheme media query and the color-scheme meta-tag. Please read the full article to learn how to do it properly.

Khiva

Looks like none of the methods mentioned in the article seem to work. – Misdoubt

This is beyond retarded, as if we don't have enough to deal with, now we have browsers that completely annihilate the carefully thought out colour scheme that a designer worked on for weeks. As if the way a brand presents itself is something arbitrary that some stupid browser is entitled to mess with. As for the suggested article, I read it twice and still have no clue how to implement the prefers-color-scheme media query, or meta tag, or whatever the hell it is. – Diadem

@DavidMartins I feel your pain, and am in a similar boat in some of my projects, BUT as a user of this feature I'm really happy and hope Samsung will continue on this path. – Linell

@Linell A website is proprietary material. Last time I checked I didn't give Samsung permission to mess with my design. As for those who use this feature, they probably don't even realize that it will be implemented everywhere. Not only do Samsung and others have no right to mess with other people's products in this way, but there's also no remotely valid justification to do it. At the very least creators should be able to opt out of it. The only people who are OK with this are either those who have budgets big enough to entertain this crap or those who couldn't care less about presentation. – Diadem

@DavidMartins You don't seem to understand what the web is about. If you want pixel perfection and proprietary material then you shouldn't build a website but a native program or a native app. A website must be readable by different browsers (which all come with their own default styling), and it is natural for the users to be able to override any CSS rule they so desire. That's how the web was built, and how it was always meant to be used! Your website's own styling is nothing but the default way to present your pages, and some browsers don't even support styling at all. – Linell

@Linell You don't seem to understand what design and its purpose are. Some people put a lot of effort into improving the user experience to see it compromised by nonsense that serves no purpose. And what percentage of users override styling, or use browsers that don't support styling? As for what the web is about, and since we're not in 1995, I would expect some level of reliable standards. – Diadem

@DavidMartins it seems we are running in circles here, but I am just reminding you of the intended purpose of the web, and design will always be a second class citizen in the web because accessibility is of superior value. Some people don't see colours well, or don't see at all, or don't want your beautiful light coloured theme, and it's all right. – Linell

@Linell Design IS accessibility. Making information clearer, more digestible, and compelling. Particularly relevant also to how you want to convey a message. Especially in a branding context. Even more so, on the internet where the attention span is particularly short. Second-class citizen? Its whole purpose is to organize and present information. And what percentage of the users do not see colors or don't see at all? And what does that have to do with anything if they're visually impaired to begin with? Some people don't have access to the Internet, maybe we should stop making websites... – Diadem

You cannot say "design IS accessibility" and then disregard people with disabilities. The web is vaster than your designer centric view, with people browsing without even a screen, and this is proof that the web as been well designed with accessibility in mind. People will continue to tweak designs that they do not like, because in the end users know better than designers what they like and do not like. – Linell

Answer 2

Yes, Samsung has published the mentioned article, but the prefers-color-scheme does not work, despite I used the <meta name="color-scheme" content="light dark"> tag. The only solution I found is testing your website on actual Samsung device and using !important variable after css values which get changed. Bunch of ignorant devs work at Samsung it seems.

Hellkite

!important also not work, any update? – Phobos

yes, !important works only in some cases – Hellkite

The idea of adding "!important" (a terrible CSS practice to begin with) to I don't know how many styles, to accommodate the whims of the geniuses who had this retarded idea is preposterous. – Diadem

@DavidMartins if you have ANY actual solution, bring it on – Hellkite

@Hellkite At the moment this has no solution. I've decided to add this to my projects: <script> window.onload = function () { if (navigator.userAgent.match(/samsungbrowser/i)) { alert("You are using a defective browser (Samsung Internet) which may not present this site properly. We recommend using Google Chrome, Firefox or Microsoft Edge."); } }; </script> – Diadem

Ignorant of what? They absolutely know the impact of their work, which is 100% the way the internet is supposed to be. As a user who enjoys dark mode, I can't complain. – Linell

Answer 3

In 2017, Samsung internet introduced dark mode to its web browser. If the user has dark mode enabled, they can surf any web page through dark mode in Samsung internet read here

Does anyone know how to fix this?

Unfortunately since this is a browser implementation you can't do anything to avoid a user going to dark mode within Samsung internet.

Scriabin