Chrome adds Dark Mode support to Scrollbars for some websites

Scrollbars and forms controls of the websites that support dark themes by using Prefers-color-scheme media query to appear darker as well in the Chrome browser in the dark mode.

The dark mode is everywhere. It has been enabled and offered on Apps, Websites, and Operating Systems on devices.

When a user sets the Operating System – Android, Windows, Mac, Linux, and Chome OS- theme to dark, Chrome user interface such as a menu, toolbar, tab bar, and settings turns to dark, but not the content on websites.

There is a flag available for Chrome (and Edge) on desktop and Android platforms for users to force dark mode for web content. This has been recently made available as a setting by Vivaldi on its Android version, but still, the scrollbar doesn’t appear dark.

The bright/white scrollbars on dark theme sites that use Color-scheme meta tag may look ugly, Google Chrome has now a fix available for this behind a flag named ‘Web Platform Controls Dark Mode’ in the Canary version.

The ‘form controls dark mode’ available for Windows, Mac, Linux, and Chrome OS when enabled, shows scrollbars and forms controls as dark in the dark mode.

Web Platform Controls Dark Mode

If enabled, forms controls and scrollbars will be rendered with a dark theme, only on web pages that support dark color schemes, and when the OS is switched to dark theme. – Mac, Windows, Linux, Chrome OS

#form-controls-dark-mode

Here is how you can make scrollbars to appear dark in Chrome

1. Visit Chrome://flags page

2. Search for “Web Platform Controls dark mode”