[Ar-Curunir]

This can be done via userChrome.css. Just add this:

#tabbrowser-tabs { visibility: collapse !important; }

[guns → Ar-Curunir]

Thanks for this tip! Private browsing mode causes the tab bar to reappear (though the tabs are still hidden), so I found that the selector #TabsToolbar works even better.

Also, the large, bright sidebar header can be hidden with the #sidebar-header selector.

Combining those, we have:

    #TabsToolbar, #sidebar-header { visibility: collapse !important; }

[mannigfaltig → guns]

I've added a modification that removes any margin at the top:

    #TabsToolbar, #sidebar-header {
      visibility: collapse !important;
    }
    
    #TabsToolbar {
      margin-bottom: -21px !important;
    }

Then go to the hamburger menu > Customization and check "Title Bar" at the bottom left. Then it pretty much looks like FF 56.

I've also changed the style of TSTs in the add-on settings (all the way at the bottom; not in userChrome.css) such that the tabs don't take up as much vertical space and to hide the close box button (and only show it on the mouse-over event):

    .closebox {
      display: none
    }
    
    .tab:hover .closebox {
      display: block;
    }
    
    .tab {
      padding-top: 0px;
      padding-bottom: 0px;
    }

You can make `.tab` even tighter:

    .tab .icon {
      padding-top: 2px; /* reducing it by 2px */
      padding-bottom: 2px;
    }
    
    :root {
      --tab-height: 22px; /* reducing it by 4px */
    }

[wakkaflokka → Ar-Curunir]

Novice question... where do I find userChrome.css on Windows?

[yamaneko → wakkaflokka]

A bit late to the party, but posting for reference in case someone finds this post in the future. For Ubuntu, I did as the following:

1. Created the chrome folder at `~/.mozilla/<your-profile-id>.default/`

2. Created `~/.mozilla/<your-profile-id>.default/chrome/userChrome.css` and added

    @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); 

at the top of the file.

3. Added customizations after this line. The resulting file will be like:

    @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); 
    /*
     * TreeStyleTabs solutions to remove tabs
     *
     * Solution by: https://news.ycombinator.com/item?id=15343940 */
    #TabsToolbar, #sidebar-header {
      visibility: collapse !important;
    }

    #TabsToolbar {
      margin-bottom: -21px !important;
    }

[bzbarsky → wakkaflokka]

You create it in the "chrome" folder in your Firefox profile. The "chrome" folder itself may need to be created.

https://support.mozilla.org/en-US/kb/profiles-where-firefox-... has directions for finding where the profile lives.

[kibwen → wakkaflokka]

C:\Users\wakkaflokka\AppData\Roaming\Mozilla\Firefox\Profiles\random_gibberish_identifier\chrome\userChrome.css

[kibwen → Ar-Curunir]

Excellent, I was digging around for an about:config pref but this works too. :)

[mastax → Ar-Curunir]

If you're on windows and this makes your window buttons disappear, set browser.tabs.drawInTitlebar to false in about:config