Firefox 89.0beta Skeuomorph tabs

userChrome.css

.tab-background {
	border-radius: var(--tab-border-radius) var(--tab-border-radius) 0px 0px !important;
	margin-bottom: 0px !important;
}

#tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab > .tab-stack > .tab-background[multiselected="true"]:-moz-lwtheme, #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab > .tab-stack > .tab-background[selected="true"]:-moz-lwtheme {
	background-image: linear-gradient(var(--toolbar-bgcolor, transparent), var(--toolbar-bgcolor, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none) !important;
}

#TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) > .tab-stack > .tab-background:-moz-lwtheme {
	box-shadow: 0 0 1px var(--dark-menu-color) !important;
}

.tab-content {
	margin-top: var(--proton-tab-block-margin);
}

#TabsToolbar .toolbarbutton-1 {
	margin-top: var(--proton-tab-block-margin) !important;
}

Memo: related article

https://www.reddit.com/r/firefox/comments/mxmrqx/proton_tried_bringing_back_the_skeuomorph_design/
https://gist.github.com/Speedy37/63d37931601123178ac2221533292cdd
https://www.dropbox.com/s/2midhjftvdb8lom/chrome%20-%20untidy.zip?dl=0

Dropbox code:

  #scrollbutton-up,
  #scrollbutton-down{ border-block-width: var(--uc-tabs-scrollbutton-border,0px) !important; }
  .tab-background[selected]{ border: 1px solid var(--tabs-border-color) !important; border-bottom: none !important }

  
  .tabbrowser-tab:hover{ --uc-tab-fill: rgba(0,0,0,.1) }
  .tabbrowser-tab[selected]{ --uc-tab-curve-padding: 1px } 
  #TabsToolbar[brighttext] .tabbrowser-tab:hover{ --uc-tab-fill: rgba(255,255,255,.1) }
  .titlebar-spacer[type="pre-tabs"],
  .tabbrowser-tab::after{ border: none !important; }
  
  .tabbrowser-tab:hover > stack::before,
  .tabbrowser-tab:hover > stack::after,
  .tabbrowser-tab[selected] > stack::before,
  .tabbrowser-tab[selected] > stack::after{
    width: var(--uc-tab-curve-size);
    height: 100%;
    display: block;
    position: absolute;
    content: "";
    fill: var(--uc-tab-fill);
    -moz-context-properties: fill,stroke;
  }
  
  .tabbrowser-tab[selected] > stack::before,
  .tabbrowser-tab[selected] > stack::after{
    fill: var(--lwt-selected-tab-background-color,var(--toolbar-bgcolor)) !important;
    stroke: var(--tabs-border-color,transparent);
  }
  
  .tabbrowser-tab:hover > stack::after,
  .tabbrowser-tab[selected] > stack::after{
    left: auto;
    right: calc(var(--uc-tab-curve-padding,0px) - var(--uc-tab-curve-size));
    transform: scaleX(-1);
  }
  
  .tabbrowser-tab:hover > stack > .tab-background,
  .tab-background[selected]{
    border-radius: var(--uc-tab-curve-size) var(--uc-tab-curve-size) 0 0 !important;
    overflow: -moz-hidden-unscrollable
  }

#tabbrowser-tabs{
    --uc-tab-curve-size:10px; /* 10px looks about like chromium - 17px looks close to Australis tabs */
    --uc-tabs-scrollbutton-border: 0px;
    --proton-tab-block-margin:0px;
    --tab-min-height: 20px;
}
.tab-stack {
  margin-top: 4px;
}
.tab-background {
  margin: 0px !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
.tab-context-line {
  margin-top: 26px !important;
  margin-left: 6px !important;
  margin-right: 6px !important;
}
menupopup > menuitem, menupopup > menu {
    padding-block: 0.15em !important;
}

#tabbrowser-tabs .tabbrowser-tab .tab-close-button { display:none!important; }

@Dragoner7
I can't find --dark-menu-color. Do you mean --toolbar-color?

@black7375 When using Remote Debugging to inspect the browser UI, Firefox prompted it as an option, when typing var(--something). I don't know where it's being defined thought. It's not in browser.css.

you can find css vars:

// at Remote Debugging Webconsole
getComputedStyle(document.documentElement).getPropertyValue('--css-var-name')

@Dragoner7
I used this code at my project, what about the license?
I'am currently write a list of credits.

@black7375 Yeah, I know, I use your theme, It's really good. 😄

MPL 2.0, I guess? Since it contains some snippets from the Firefox source.

Ok, good.
Thank you for using my project.