Sorta but not really.

• https://addons.mozilla.org/en-GB/firefox/addon/tree-tabs/
• https://addons.mozilla.org/en-GB/firefox/addon/all-tabs-helper/

Please let us know if this solved your issue or if need further assistance.

The tree-tabs helper was the closest to a solution, but it takes up so much real estate on my interface. I "solved" this by adding the ability to make the sidebar arbitrarily narrow through adding this file:

~/.mozilla/firefox/<number>.default/chrome/userChrome.css

and fill it with the following:

   #sidebar-box {
       overflow-x: hidden !important;
   }
    #sidebar {
       min-width: 0px !important;
       max-width: none !important;
       overflow-x: hidden !important;
   }

Hi, please mark "your" answer as the solution. Glad you found something.

The best substitute for a solution I could find was to allow a thin bar of website icons tabs on the left of the browser. I successfully did this by adjusting the approach from https://www.reddit.com/r/FirefoxCSS/comments/7emhsq/my_compact_treestyletab_css_and_sidebar_hover/ :

A: Install and setup Tree-Tabs add-on to be as thin and slick as possible:

1. Install https://addons.mozilla.org/en-US/firefox/addon/tree-style-tab/
2. Set "indent tabs until" to "0" in about:addons -> Tree Style Tab -> preferences
3. Inject the following settings into the text-box in about:addons -> Tree Style Tab -> preferences -> Advanced -> Extra style rules...

       :root {
           --color-background: rgba(120,140,170,1); /*choose according to color theme*/
           --color-transparent: rgba(0,0,0,0);
       }
       
       /* ################################################ */
       /* ##### SPACIAL SETTINGS ######################### */
       /* ################################################ */
       
       /* change tab height */
       :root {
         --tab-height: 22px !important;
       }
       .tab {
         height: var(--tab-height) !important;
       }
       
       /* hide close button */
       .tab .closebox {
         display: none;
       }
       
       /* hide scrollbar */
       #tabbar { 
         overflow-y: scroll;
       }
       
       :root.left #tabbar,
       #tabContextMenu,
       #tabContextMenu ul {
         margin-left: -19px;
       }
       
       /* Hide .twisty and adjust margins so favicons go to the left. */
       .tab .twisty {
           visibility: hidden;
           margin-left: -12px;
       }
       
       /* Hide 'new tab' button. */
       .newtab-button {
           display: none;
       }
       
       /* ################################################ */
       /* ##### COLOR SETTINGS ########################### */
       /* ################################################ */
       .tab {
           background-color: var(--color-background);
           border-color: var(--color-transparent);
       }
       .tab:hover {
           background-color: var(--color-transparent);
           color: var(--color-transparent);
       }
       .tab.active {
           background-color: var(--color-transparent);
       }
       
       
       /* Rotate tab that has sound playing and make muted tabs transparent. */
       @keyframes spin {
           0% { transform: rotate(0deg); }
           100% { transform: rotate(360deg);}
       }
       .tab.sound-playing .favicon {
           animation: spin 7s linear 0s infinite;
       }
       .tab.muted {
           opacity: 0.5;
       }

B: Now add the ability to make the sidebar as narrow as the icons:

1. Create a userChrome.css file: on linux under ~/.mozilla/firefox/<number>.default/chrome/userChrome.css, for other platforms see https://www.userchrome.org/
2. Fill the file with the following code:

       /* Sidebar min and max width removal */
       #sidebar {
           max-width: none !important;
           min-width: 18px !important;
       }
       /* Hide splitter, when using Tree Style Tab. */
       #sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] + #sidebar-splitter {
           display: none !important;
       }
       /* Hide sidebar header, when using Tree Style Tab. */
       #sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] #sidebar-header {
           visibility: collapse;
       }
       /* Shrink sidebar until hovered, when using Tree Style Tab. */
       #sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"]{
           min-width: 18px !important;
           max-width: 18px !important;
       }