How To Customize Firefox Quantum’s New Interface

The much anticipated Firefox Quantum which is rumoured to be twice as fast is here. And as expected, it is filled with lotsof improvements (cue in the new Photon UI)

Photon replaces the “Australis” interface that’s been used since 2014, and features a ton of customization options. Which is good, because there are a few annoyances—like all that empty space on either side of the URL bar.

Quickly Remove Items from the Toolbar (Including Those Blank Spaces)

Let’s start with the simplest option: removing items you don’t like from the toolbar. There are a bunch of ways to do this, but here’s the fastest: right click any of the items (including those blank spaces surrounding the URL bar), and then select the “Remove from Toolbar” command.

Note that the spaces, much like the toolbar’s buttons, aren’t entirely without function. You can move the window by clicking and dragging them, which can be useful since there’s less space to click at the top of the window than there was in older versions of Firefox.

Add New Buttons and Rearrange the Toolbar

You can also add buttons to the toolbar. Right click the spaces (or anywhere else on the toolbar other than the URL bar) and choose the “Customize” option. This lets you make bigger changes to the UI.

Keep in mind that if you’re upgrading from Firefox version 56, the default customization settings might be a bit different than if you had a fresh install. For example, Firefox had the Search Bar when I upgraded on my desktop, but it was missing when I performed a fresh install on my laptop.

It’s easy to change UI elements from the Customization window. Just click and drag any item you want into the toolbar to add it, or drag items into the customize menu to remove them. This includes the empty (or “Flexible”) spaces surrounding the URL bar by default.

You can also drag items into the window on the side to add them to the overflow menu (which you can access by clicking the icon with two arrows). This is great for tools you use pretty often and want to reach quickly, but don’t need taking up space all the time.

Many extensions (at least the ones that still work in Firefox Quantum) also add buttons to the toolbar. You can move these icons too, rearranging them or hiding them away if you don’t need them.

Install New Themes

Firefox Quantum includes three stock themes, as well as a few fancier ones. Click the “Themes” button at the bottom of the “Customize” window to access them. The Default theme is pictured below (and in all the screenshots above).

If you want to reduce glare from your screen (and save a tiny bit of power if you have an OLED display), you can choose the Dark theme.

The Light theme is more in the style of older versions of Firefox.

Clicking “Get More Themes” at the bottom of the Theme menu takes you to Mozilla’s theme repository, where you can download even more.

Make the Toolbar and Buttons Smaller with “Compact” Mode

Firefox Quantum allows you to control the size of UI items by changing the “Density” setting, located at the bottom of the Customize window. Most people will be happy with the “Normal” setting, but the “Compact” setting is great for people who want to squeeze a few more pixels into webpages (or more buttons onto the toolbar). There’s also a “Touch” setting that delivers extra-large, thumb-friendly icons. By default, Firefox on Windows 10 will switch to the “Touch” setting if you put the OS into Tablet Mode. The screenshot below uses the “Compact” setting. Notice that the icons and tabs are smaller.

Bring Back the Bookmarks Bar, Menu Bar, and Title Bar

Firefox’s interface is pretty streamlined these days, but if you’re a fan of older UI elements like the bookmarks bar, title bar, and menu bar (with the dropdown menus like File, Edit, and so on), you can bring those bars back.

To enable the bookmarks bar, click the “Toolbars” dropdown at the bottom of the Customize window, and then toggle the “Bookmarks Toolbar” option on.

You can also enable the Menu Bar from this same dropdown. Most of the Menu Bar’s functionality has been copied and moved into the rest of Firefox’s UI over the past several years, so it isn’t truly necessary unless you prefer having that old school menu bar. Alternatively, you might find it easier to just press Alt to make the menu bar appear when you need it. When you’re done with it, just press Alt again to make it go away.

Lastly, you can enable the Title Bar on the Customize window. It doesn’t show up on the “Toolbars” dropdown menu (because it’s not technically a toolbar), but there’s a “Title Bar” check box you can enable at the bottom left corner of the window. Honestly, though, we think that Chrome had the right idea killing off the title bar back in 2008 (and Quantum Firefox, now). It takes up a lot of space to display relatively little information.

If you don’t need the full Title Bar but would still like something to grab and drag the window with, consider enabling the “Drag Space” check box instead. This option adds a few pixels above the top of the tabs, giving you more space to click and drag the window.

Note that the Drag Space only appears if the window is not maximized. Unless you’re moving between a bunch of monitors, there isn’t much need for Drag Space when Firefox is taking up the whole screen.

Also keep in mind that the Drag Space and Title Bar aren’t your only two options to move the window around. You can also click and drag the Flexible Spaces we removed earlier, or any empty space on the tab bar, including the little space between tab controls and the minimize button.

Stop the Downloads Button from Auto-Hiding

Starting in Firefox Quantum, the “Downloads” button only appears when you download a file, phasing in and out as needed. If you aren’t a fan of UI objects popping up, you can force the button to stay in position. With the “Customize” window open, click the “Downloads” button, and then turn the “Auto-hide” option off.

Try it, do you like what you see? tell us in the comments section