Change User Interface Density in Firefox

Firefox 57 Icon Logo

Here is how to change User Interface Density in Firefox. Also we will see how to enable Compact Density in Firefox 89 and above.

As you may already know, Firefox 57 comes with a new UI, known as "Photon". The default appearance of the browser includes a default theme with a dark blue title bar. There are few themes which come pre-installed with the browser. In addition to themes, Firefox allows changing the user interface density. In this article, we will see how it can be done.

Firefox 57 is a huge step forward for Mozilla. The browser features a new engine "Quantum". It was a difficult move for developers, because with this release, the browser drops support for XUL-based add-ons completely. All of the classic add-ons are deprecated and incompatible, and only a few have moved to the new WebExtensions API. Some of the legacy add-ons have modern replacements or alternatives. Unfortunately, there are plenty of useful add-ons which have no modern analogs.

The Quantum engine is all about parallel page rendering and processing. It is built with a multi-process architecture for both CSS and HTML processing, which makes it more reliable and faster.

You can enlarge the user interface of the browser to make it more compact by changing its density. Here is how.

To change user interface density in Firefox, do the following.

  1. Click the hamburger menu button and click the "Customize" item.
  2. Click on the "Density" item at the bottom of the "Customize" pane.
  3. Click on either Compact, Default or Touch item in the drop down list according to what you want. Compact is the smallest UI type, Touch is the biggest one.

Combining this parameter with the UI scaling factor, you can get a more usable user interface for the browser.

It is worth noting that starting in Firefox 89, the Compact density option is no longer displayed by default in the Customize Firefox pane.

Mozilla decided to move it out of support. This means you need to perform an extra step to get it working.

Enable Compact Density in Firefox 89

  1. Open Firefox.
  2. Type about:config into the address bar.
  3. Type into the search box.
  4. Set the option to true.
  5. Restart the browser.
  6. You now will be able to pick the Compact Density option from the menu.

You are done.

It is worth mentioning that you can directly set the browser.uidensity option in about:config to 1 to directly enable Compact Density mode without enabling it in the GUI. But having a GUI option is indeed much convenient.

Support us

Winaero greatly relies on your support. You can help the site keep bringing you interesting and useful content and software by using these options:

If you like this article, please share it using the buttons below. It won't take a lot from you, but it will help us grow. Thanks for your support!

Author: Sergey Tkachenko

Sergey Tkachenko is a software developer who started Winaero back in 2011. On this blog, Sergey is writing about everything connected to Microsoft, Windows and popular software. Follow him on Telegram, Twitter, and YouTube.

3 thoughts on “Change User Interface Density in Firefox”

  1. Sergey,
    please give me a suggestion: I can’t see download progress on Firefox (56) taskbar icon, anymore.

    How can I fix that?


Leave a Reply

Your email address will not be published.

Exit mobile version
Using Telegram? Subscribe to the blog channel!
Hello. Add your message here.