Firefox 89: Farbe der Tabs ändern?

[cyberpirate]

Moin,

kann Ich die Farbe des aktiven Tabs im FF 89 ändern?

MfG

 

[2002Andreas]

des aktiven Tabs im FF 89 ändern?

Teste bitte, Farbe wenn dann anpassen.

.tabbrowser-tab[selected] .tab-content {
    background: orange !important;
}

Einzutragen in die userChrome.css

Sollte der Ordner chrome nicht vorhanden sein musst du ihn dir erst erstellen, und in ihm dann eine userChrome.css
Du mußt dir im Profilordner einen neuen Ordner chrome erstellen und in diesem dann eine Textdatei ( mit einem Editor ) in die du den Code kopierst, bzw. einträgst.

Dann schließt du die Datei und speicherst sie als userChrome.css ab.
Danach mußt du den Firefox neu starten.

PS:
Du musst dir dazu die versteckten Dateiendungen anzeigen lassen.

Um das einzustellen klickt man im Windows 10 Explorer (wenn man einen Ordner offen hat) erst oben links auf Ansicht..dann rechts oben auf

"Optionen" > "Ordner und Suchoptionen ändern" > "Ansicht"

und entfernt das Häkchen bei "Erweiterungen bei bekannten Dateitypen ausblenden"

Wo finde ich meinen Profilordner

Zusätzlich muss in about:config der Eintrag:

toolkit.legacyUserProfileCustomizations.stylesheets

auf true stehen.

 

[cyberpirate]

Super. Vielen Dank. Funktioniert. Erstmal die Farbe genommen die Du schon eingefügt hast. Wie kann Ich dann andere Farben definieren? Gilt der normale HTML Code für Farben? oder funktionieren nur Sachen wie Orange, Blau , Grün etc?

 

[2002Andreas]

andere Farben definieren?

Einfach orange austauschen.

Du kannst auch hexacodes verwenden.
#7fff00

Oder auch:
rgb(255,69,0)

 

[cyberpirate]

Das meinte Ich. Toll. Ich danke Euch!

 

[Ponderosa]

Vielleicht mit dem FirefoxAddon Colorfultabs

 

[Leo.16]

wie kann man denn dann die Schriftfarbe ändern?

Und bei FF89 sind im neuen Design die Ecken rund, werden so aber eckig.

 

[2002Andreas]

die Schriftfarbe ändern?

Aktiver Tab:

.tabbrowser-tab[selected] {
  color: red !important;
}

Inaktiver Tab:

.tabbrowser-tab:not([selected]) {
  color: green!important;
}

 

[Travis]

Hey Leute ,

ich hab' den neuesten FF jetzt auch.

Diese nunmehr helle Leiste oben ist in der Tat etwas gewöhnungsbedürftig, aber ich gewöhne mich immer mehr daran. (Großartig manuell am Design rumschrauben will ich vorerst mal nicht, weil ich da wahrscheinlich dabei eh mehr kaputtmachen würde, hihi ... Ich lasse vorerst mal alles so, wie es halt jetzt sein soll.)
Und war es nicht eigentlich sogar so, dass man sich ursprünglich vielmehr an diese davor dunkelblaue Farbe der oberen Leiste gewöhnen musste? Na, wie auch immer.

Etwas lustig aber, dass das "Über Firefox"-Fenster aber offenbar das alte Design bzw. die alte Farbe behalten hat, lol ...

​

...

 

[cyberpirate]

wie kann man denn dann die Schriftfarbe ändern?

Und bei FF89 sind im neuen Design die Ecken rund, werden so aber eckig.

Ja habe Ich auch gerade festgestellt. Kann man das noch ändern?

 

[2002Andreas]

Kann man das noch ändern?

Welchen Code benutzt du denn für den HG der Tabs?

 

[cyberpirate]

Bisher nur den der der in Post 2 vorgegeben war. Muss zu Hause später weiter testen.

 

[2002Andreas]

Kann man das noch ändern?

Möchtest du die abgerundet, dann:

.tabbrowser-tab[selected] .tab-content {
  background: orange !important;
  border-radius: 80px !important;
}

.tabbrowser-tab:not([selected]) .tab-content {
  background: red !important;
  border-radius: 80px !important;
}

.tab-background {
  border-radius: 80px !important;
}

Möchtest du sie eckig, dann:

.tabbrowser-tab[selected] .tab-content {
  background: orange !important;
  border-radius: 0px !important;
}

.tabbrowser-tab:not([selected]) .tab-content {
  background: red !important;
  border-radius: 0px !important;
}

.tab-background {
  border-radius: 0px !important;
}

 

[Marc_N]

Wenn man nur die Farben anpassen möchte -> color.firefox.com

 

[cyberpirate]

Möchtest du die abgerundet, dann:

Super vielen Dank!

So und wenn Ich jetzt noch die Textfarbe der Tabs ändern kann wäre das perfekt. Geht wahrscheinlich ähnlich einfach?

 

[Sepp Depp]

man nur die Farben anpassen möchte

Danke, das Tool war mir mittlerweile entfallen.
Endlich hebt sich der aktive Tab wieder deutlicher ab.

 

[cyberpirate]

über die css geht es wunderbar ohne Tool:

 

[2002Andreas]

die Textfarbe der Tabs

Auch das geht:

.tabbrowser-tab[selected] .tab-label {
  color: white !important;
}

.tabbrowser-tab:not([selected]) .tab-label {
  color: white !important;
}

Die Farben musst du dir dann anpassen.

Und wenn gewünscht für hover:

.tabbrowser-tab[selected]:hover .tab-content {
  background: blue !important;
}

.tabbrowser-tab:not([selected]):hover .tab-content {
  background: green !important;
}

 

[cyberpirate]

Hab Ich es mir doch gedacht. SUPER. Ist das gleich für aktiven und inaktiven Tab? Muss das dann sozusagen immer unter dem vorigen CSS stehen damit die Farbe geändert wird?

Und jetzt noch die Höhe der tabs. Auch möglich?

 

[2002Andreas]

die Höhe der tabs

Teste bitte mal mit diesem kompl. neuen Code.
Die Farben musst du dir dann anpassen.

/*Tabs abgerundet*/
.tabbrowser-tab:is([visuallyselected="true"], [multiselected]) > .tab-stack > .tab-background,
.tabbrowser-tab:not([visuallyselected="true"]) > .tab-stack > .tab-background {
  border-radius: 80px!important;
}

/*Aktiver Tab hover HG rot*/
.tabbrowser-tab:is([visuallyselected="true"]:hover, [multiselected]) > .tab-stack > .tab-background {
  background: red !important;
}

/*Aktiver Tab Text weiß*/
.tabbrowser-tab[visuallyselected="true"]:hover {
  color: white !important;
}

/*Aktiver Tab HG orange*/
.tabbrowser-tab:is([visuallyselected="true"], [multiselected]) > .tab-stack > .tab-background {
  background: orange !important;
}

/*Inaktiver Tab hover HG blau*/
.tabbrowser-tab:not([visuallyselected="true"]):hover  > .tab-stack > .tab-background {
    background: blue !important;   
}

/*Inaktiver Tab Text weiß*/
.tabbrowser-tab:not([visuallyselected="true"]):hover {
  color: white !important;
}

/*Inaktiver Tab HG hellgrau*/
.tabbrowser-tab:not([visuallyselected="true"]) > .tab-stack > .tab-background {
    background: lightgrey !important;   
}

Ergänzung (3. Juni 2021)

Und jetzt noch die Höhe der tabs.

In about:config den Wert

browser.compactmode.show

auf true setzen.
Dann im Anpassenfenster unten über Dichte den Kompaktmodus aktivieren.