How to reduce height of three bars above each other by combining - browser in Zorin

[perina]

is there any way of combining some of the bars together? Seems like waste of space & UI opportunity.

[Aravisian]

The first bar you point to is the system panel.
The second is the headerbar for FireFox.
Next is the addressbar for Firefox. The Firefox app is already using CSD, which reduces titlebar height by combining things together.
You can reduce some of these heights by reducing the panelbar height if it is visible in the extension that adds TaskBar Settings by right clicking the panel.
And the headerbar height by creating a custom gtk.css file in your ~/.config/gtk-3.0

You can search the web for many pointers on how to do that; "reduce headerbar height."

That said...
You may be able to reduce the height by three milimeters.
In the meantime, below the bars, where visibility is a good thing, will be the many webpages themselves composed primarily of empty space.

I would encourage you to question whether a UI opportunity is being missed in trying to reduce the visibility of an area that needs it in order to favor an expansive area that needs it much less.
Combining also packs more items into a smaller space- often necessitating the removal of items to get things to fit: Which is the opposite of a UI opportunity.
UI means User Interface. Making the Interface Less or making it go Away is non-interface.
This may just be a personal preference on your part to have slimmer panels or titlebars.

[Elegant_Emperor]

You can also remove the totally useless headbar in Firefox by right clicking on the
toolbar->customise toolbar->uncheck the titlebar visibility setting:

Result:

[Aravisian]

@Elegant_Emperor

You can also remove the totally useless headbar in Firefox by right clicking on the toolbar ->customise toolbar->uncheck the titlebar visibility setting:

You can see in the screenshot that Firefox is already using the CSD headerbar.

[Elegant_Emperor]

Oops...Missed it! Thanks for pointing it out.

[Aravisian]

I missed where someone posted their Neofetch output in the O.P., the other day and then I asked them to post it...

Our brains need a Manual.

[rexx]

Toggle F11, show/Hide. Ideal when wanting more room on web pages.

[anon2532484]

There are compact themes for firefox available on the Internet for you to use (and many more, which aim to look like something entirely different)

either way, in the about:config page of Firefox (simply paste that into the address bar) you can enable toolkit.legacyUserProfileCustomizations.stylesheets by double-clicking on it to make it true

from there, you can open Files, enable hidden files, and paste themes into the .firefox/[some characters].default-release/chrome/ folder (you may have to create the chrome/ folder)

here is a page of different themes I found on the internet, one of them is a compact theme:

FirefoxCSS Store