Customize Consent Preferences

We use cookies to help you navigate efficiently and perform certain functions. You will find detailed information about all cookies under each consent category below.

The cookies that are categorized as "Necessary" are stored on your browser as they are essential for enabling the basic functionalities of the site. ... 

For more information on how Google's third-party cookies operate and handle your data, see: Google Privacy Policy

Always Active

Necessary cookies are required to enable the basic features of this site, such as providing secure log-in or adjusting your consent preferences. These cookies do not store any personally identifiable data.

Functional cookies help perform certain functionalities like sharing the content of the website on social media platforms, collecting feedback, and other third-party features.

Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics such as the number of visitors, bounce rate, traffic source, etc.

Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.

Advertisement cookies are used to provide visitors with customized advertisements based on the pages you visited previously and to analyze the effectiveness of the ad campaigns.

#Ubuntu

How to Enable Dark Mode in Chrome on Ubuntu (No Code, Apps, Themes)

If you need a website or want to collaborate, contact me or find our more.

Author: Radu

Pay once, use forever—get huge lifetime software deals on ProductCanyon • Ad

Since I started having vision problems, I began using dark mode wherever possible: browsers, apps, operating systems, and so on.

If you set Windows 10 to dark mode, then Chrome will inherit that preference automatically, and it will set itself to dark mode, too.

And websites that have a dark mode version ready will use the preference set by Chrome. It’s kind of a dark mode chain reaction, which is nice.

So, since I just switched to Ubuntu from Windows 10, I wanted dark mode everywhere there, too.

Unfortunately, setting Ubuntu on dark mode won’t set Chrome as well. Thus, it’s not that straightforward as on Windows 10, and it will work a bit differently, but it’s still simple to set up.

Enable Dark Mode in Chrome on Ubuntu

As I mentioned in the title, I’m using a method that doesn’t involve coding, 3rd party apps (e.g. Gnome Tweak Tools), or themes for Chrome. I don’t like installing 3rd party stuff unless it’s really necessary.

I’m using Ubuntu Desktop 20.10, not the LTS version. Just so you know.

Now, let’s get to the main point.

Step 1

Open Chrome and:

  • Type chrome://flags in the address bar;
  • Type “dark mode” in the search bar;
  • Select Enabled for Force Dark Mode for Web Contents.

You’ll notice that the address bar, tabs, and others are still in light mode. That’s because it only renders web contents/internal pages using dark mode, not the whole browser.

Step 2

To go full dark mode, access Chrome’s settings by clicking on the 3 vertical dots, in the top-right corner, and selecting Settings.

Step 3

Select Appearance and click on the Use GTK+ button, in the Theme section.

As explained by someone in the comments (when they were available), GTK+ is a free and open-source cross-platform widget toolkit for creating graphical user interfaces (GUIs).

You’ll notice that Chrome has gone into full dark mode now, not just the web contents/internal pages.

If you want the scrollbar and form controls to be dark, too, then you can enable the second flag in Chrome - Web Platform Controls Dark Mode (see step 1).

All web pages will be automatically rendered by Chrome using dark mode

The flag that enables the dark mode in Chrome is implemented for all web pages, not just the ones that have a version created especially for the dark mode preference.

Normally, website owners that also want to have a dark mode design, as I do, along with the light one, create additional styles in CSS and use the @media (prefers-color-scheme: dark) feature to activate them only when dark mode is detected in Chrome or other browsers.

The porblem is that if Chrome doesn’t inherit Ubuntu’s Dark mode setting, it also doesn’t make use of @media (prefers-color-scheme: dark) feature. Firefox does, for example.

The good and the bad

So, with that flag enabled in Chrome, it means that every website that doesn’t have its own dark mode version will now have one created automatically by Chrome, using whatever color scheme it thinks it’s best.

As a user, this is good for me - and most of you, I think - because most websites don’t have a dark mode version available.

For the most part, Chrome does a good job at rendering websites in dark mode automatically. As an example, here’s my former blog, which was converted into this one, Radu.link:

WebStoked.com - now Radu.link

As another example, here’s how it rendered my former website.

WPSiteIcons.com

Not that bad, right?

The problem is that some websites might not have good design practices, or might have some features that prevent Chrome to properly create a dark mode design automatically.

So, some websites might end up looking like this:

The Search Engine Roundtable blog

This is an SEO blog that I read frequently – Search Engine Roundtable.

You can see from the screenshot that the menu’s contrast is affected and there are several white spaces and sections.

This affects the readability and can be annoying for some of you, or you might think that the website is broken if you forget that you enabled the experimental flag in Chrome.

If this bothers you too much, you might want to search for other methods to enable dark mode in Chrome on Ubuntu. I’m ok with this one for now.

Do You Own a Website? You Should Implement a Dark Mode Version Soon

This dark mode flag for web contents is experimental in Chrome. This means that, at some point, it might go live in every user’s settings.

And if you don’t want Chrome to render your website using dark mode however it sees fit, add your own dark mode version, and it will use that.

Leaving Chrome to do the job for you might also make your website look broken, as you can see from the above screenshot. That’s a scary thought.

That’s a Wrap

If this post helped you, please consider following me on Bluesky or Instagram to support me.

Also, don't hesitate to contact me if you're interested in my web design services, want to collaborate, or just have something to say.

About Radu

I've been working online from home for over 11 years, gaining valuable experience and developing a wide range of skills, including web design and development, optimization, and SEO.

More posts