Firefox hide the tab bar via css

tab.md

Enable Custom Firefox CSS

1. Open about:config in Firefox.
2. Search for toolkit.legacyUserProfileCustomizations.stylesheets
3. Set the value to true.

Locate Your Firefox Profile

1. Open about:support.
2. Find Profile Folder.
3. Click Show in Finder.

On macOS, the profile is usually located at:

~/Library/Application Support/Firefox/Profiles/xxxxxxxx.default-release/

Create userChrome.css

Inside the Firefox profile, create a directory named chrome and a file named userChrome.css.

Expected structure:

<Firefox Profile>/
└── chrome/
    └── userChrome.css

You can create them using Terminal:

mkdir -p chrome
nvim chrome/userChrome.css

Hide Firefox's Native Tabs

Initially, we used:

#TabsToolbar {
  visibility: collapse !important;
}