Jump to content

Firefox 72: dynamic scrollbars based on page color


Karlston
 Share

Recommended Posts

Firefox 72: dynamic scrollbars based on page color

Mozilla plans to adapt the color of the scrollbar in the Firefox web browser to the background color of the visited webpage in Firefox 72.

 

Dark themes are en vogue currently; operating systems, web browsers, and other applications get dark theme options that users may enable to switch from the previously favored light design to a black design.

 

For many, it seems like a personal preference more than anything else, but dark themes offer some advantages over lighter themes including better battery performance on mobile devices.

 

Firefox users may enable a dark theme in the browser on the Menu > Customize page of the web browser; this paints the browser UI in darker colors. Certain websites, e.g. DuckDuckGo or Startpage, support dark themes as well that users may enable.

 

One of the issues that Firefox users experienced with dark themed sites in the browser was that the scrollbar area was not adapted accordingly.

 

firefox adaptive scrollbar color

 

The scrollbar used a light design regardless of website or selected Firefox theme; this felt distracting to many users. Some used custom CSS styles to paint scrollbars in a dark color, others endured the light area on websites visited in the Firefox web browser.

 

Starting with Firefox 72, Firefox will adapt the color of the scrollbar based on the background color of the visited page. Users of the browser who prefer a darker theme will notice that the color of the scrollbar area shines in a darker color as well and that page position indicator is darker than before as well.

 

The screenshot above highlights the change. The window on top shows the new scrollbar color scheme on the dark homepage of the search engine DuckDuckGo.

 

Sites that don't use standards when it comes to dark themes or modes may not show the correct scrollbar colors after all; this is the case for Reddit which, according to a comment on the official bug listing on Mozilla's bug tracking site, sets the dark background "on a child element of the scrollable container" so that Firefox cannot detect the dark theme usage.

 

Firefox 72 Stable will be released on January 7, 2020 according to the release schedule.

 

 

Source: Firefox 72: dynamic scrollbars based on page color (gHacks - Martin Brinkmann)

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...