theme

Ab Firefox 60 optional. Vor Firefox 60 erforderlich.

Ein JSON-Objekt, dessen Eigenschaften die Bilder darstellen, die in verschiedenen Bereichen des Browsers angezeigt werden. Einzelheiten zu den möglichen Eigenschaften dieses Objekts finden Sie unter images.

Erforderlich

Ein JSON-Objekt, dessen Eigenschaften die Farben verschiedener Bereiche des Browsers darstellen. Einzelheiten zu den möglichen Eigenschaften dieses Objekts finden Sie unter colors.

Optional

Dieses Objekt enthält Eigenschaften, die beeinflussen, wie die Elemente von "additional_backgrounds" angezeigt und Farbschemata angewendet werden. Einzelheiten zu den möglichen Eigenschaften dieses Objekts finden Sie unter properties.

Ein Vordergrundbild (angegeben durch den Pfad zu einer in der Erweiterung enthaltenen Bilddatei) oder ein CSS-Farbverlauf, das bzw. der dem Header-Bereich hinzugefügt und an dessen oberer rechter Ecke ausgerichtet wird. CSS-Farbverläufe werden ab Firefox 153 unterstützt.

Ab Firefox 60 auf Desktop-Geräten optional.

Ein Array zusätzlicher Hintergründe, bei denen es sich jeweils entweder um den Pfad zu einer in der Erweiterung enthaltenen Bilddatei oder um einen CSS-Farbverlauf handelt. Sie werden dem Header-Bereich hinzugefügt und hinter dem Element "theme_frame": angezeigt. Das erste Element des Arrays liegt dabei ganz oben, das letzte ganz unten. CSS-Farbverläufe werden ab Firefox 153 unterstützt.

Optional

Standardmäßig werden alle Elemente an der oberen rechten Ecke des Header-Bereichs ausgerichtet. Ihre Ausrichtung, ihr Wiederholungsverhalten und ihre Größe sowie der Bereich des Browserfensters, in dem sie gezeichnet werden, lassen sich jedoch über "properties": steuern.

Da zusätzliche Hintergründe hinter dem Element theme_frame angezeigt werden, sind sie nicht sichtbar, wenn theme_frame als CSS-Farbverlauf festgelegt ist.

Die Farbe von Text und Symbolen in der Lesezeichenleiste und der Suchleiste. Wenn tab_text nicht definiert ist, legt sie auch die Textfarbe des aktiven Tabs fest. Wenn icons nicht definiert ist, legt sie außerdem die Farbe der Symbolleistensymbole fest. Wird als mit Chrome kompatibler Alias für toolbar_text bereitgestellt.

"theme": {
  "colors": {
    "frame": "black",
    "tab_background_text": "white",
    "tab_text": "white",
    "toolbar": "black",
    "bookmark_text": "red"
  }
}

Die Hintergrundfarbe gedrückter Schaltflächen in der Symbolleiste.

"theme": {
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "button_background_active": "red"
  }
}

Die Hintergrundfarbe von Schaltflächen in der Symbolleiste beim Darüberfahren mit dem Mauszeiger.

"theme": {
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "button_background_hover": "red"
  }
}

Die Farbe der Symbolleistensymbole, ausgenommen die Symbole in der Suchleiste.

"theme": {
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "icons": "red"
  }
}

Die Farbe von Symbolleistensymbolen im Aufmerksamkeitszustand, etwa des Sternsymbols für Lesezeichen oder des Symbols für einen abgeschlossenen Download.

"theme": {
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "icons_attention": "red"
  }
}

Die Hintergrundfarbe des Header-Bereichs. Sie wird in den Teilen des Headers angezeigt, die nicht von den in "theme_frame" und "additional_backgrounds" angegebenen Elementen bedeckt sind oder durch diese hindurch sichtbar bleiben.

"theme": {
  "colors": {
     "frame": "red",
     "tab_background_text": "white"
  }
}

Die Hintergrundfarbe des Header-Bereichs, wenn das Browserfenster inaktiv ist. Sie wird in den Teilen des Headers angezeigt, die nicht von den in "theme_frame" und "additional_backgrounds" angegebenen Elementen bedeckt sind oder durch diese hindurch sichtbar bleiben.

"theme": {
  "colors": {
     "frame": "red",
     "frame_inactive": "gray",
     "tab_text": "white"
  }
}

Die Hintergrundfarbe der Seite „Neuer Tab“.

"theme": {
  "colors": {
     "ntp_background": "red"
  }
}

Die Hintergrundfarbe der Karten auf der Seite „Neuer Tab“.

"theme": {
  "colors": {
     "ntp_card_background": "red"
  }
}

Die Textfarbe der Seite „Neuer Tab“.

"theme": {
  "colors": {
     "ntp_text": "red"
  }
}

Die Hintergrundfarbe von Popups, beispielsweise des Dropdown-Menüs der URL-Leiste und der Pfeil-Panels.

"theme": {
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "popup": "red"
  }
}

Die Rahmenfarbe von Popups.

"theme": {
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "popup": "black",
     "popup_text": "white",
     "popup_border": "red"
  }
}

Die Hintergrundfarbe von Elementen, die innerhalb von Popups per Tastatur hervorgehoben werden, beispielsweise eines ausgewählten Eintrags im Dropdown-Menü der URL-Leiste.

"theme": {
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "popup_highlight": "red",
     "popup_highlight_text": "white"
  }
}

Die Textfarbe hervorgehobener Elemente innerhalb von Popups.

"theme": {
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "popup_highlight": "black",
     "popup_highlight_text": "red"
  }
}

Die Textfarbe von Popups.

"theme": {
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "popup": "black",
     "popup_text": "red"
  }
}

Die Hintergrundfarbe der Sidebar.

"theme": {
  "colors": {
     "sidebar": "red",
     "sidebar_highlight": "white",
     "sidebar_highlight_text": "green",
     "sidebar_text": "white"
  }
}

Die Farbe des Rahmens und der Trennlinie der Browser-Sidebar.

"theme": {
  "colors": {
     "sidebar_border": "red"
  }
}

Die Hintergrundfarbe hervorgehobener Zeilen in integrierten Sidebars.

"theme": {
  "colors": {
     "sidebar_highlight": "red",
     "sidebar_highlight_text": "white"
  }
}

Die Textfarbe hervorgehobener Zeilen in Sidebars.

"theme": {
  "colors": {
    "sidebar_highlight": "pink",
    "sidebar_highlight_text": "red",
  }
}

Die Textfarbe von Sidebars.

"theme": {
  "colors": {
     "sidebar": "red",
     "sidebar_highlight": "white",
     "sidebar_highlight_text": "green",
     "sidebar_text": "white"
  }
}

Die Farbe der vertikalen Trennlinie zwischen inaktiven Tabs.

"theme": {
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "tab_background_separator": "red"
  }
}

Die Textfarbe in inaktiven Tabs. Wenn tab_text und bookmark_text nicht angegeben sind, gilt sie auch für den Text des aktiven Tabs.

"theme": {
  "colors": {
    "frame": "black",
    "toolbar": "white",
    "tab_background_text": "red"
  }
}

Die Farbe der Linie des ausgewählten Tabs.

"theme": {
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "tab_line": "red"
  }
}

Die Farbe der Ladeanzeige und der Ladeanimation des Tabs.

"theme": {
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "tab_loading": "red"
  }
}

Die Hintergrundfarbe des ausgewählten Tabs. Wenn diese Eigenschaft nicht verwendet wird, bestimmen frame und frame_inactive die Farbe des ausgewählten Tabs.

"theme": {
  "images": {
  "theme_frame": "weta.png"
},
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "tab_selected": "red"
  }
}

Ab Firefox 59 definiert diese Eigenschaft die Textfarbe des ausgewählten Tabs. Wenn tab_line nicht angegeben ist, bestimmt sie auch die Farbe der Linie des ausgewählten Tabs.

"theme": {
  "images": {
  "theme_frame": "weta.png"
},
  "colors": {
     "frame": "black",
     "tab_background_text": "white",
     "tab_selected": "white",
     "tab_text": "red"
  }
}

Die Hintergrundfarbe der Navigationsleiste, der Lesezeichenleiste und des ausgewählten Tabs.

Sie legt auch die Hintergrundfarbe der Suchleiste fest.

"theme": {
  "colors": {
    "frame": "black",
    "toolbar": "red",
    "tab_background_text": "white"
  }
}

Die Farbe der Linie, die den unteren Rand der Symbolleiste vom darunterliegenden Bereich trennt.

"theme": {
  "colors": {
    "frame": "black",
    "tab_background_text": "white",
    "toolbar_bottom_separator": "red"
  }
}

Die Hintergrundfarbe von Feldern in der Symbolleiste, beispielsweise der URL-Leiste.

Sie legt auch die Hintergrundfarbe des Felds Auf dieser Seite suchen fest.

"theme": {
  "colors": {
    "frame": "black",
    "tab_background_text": "white",
    "toolbar_field": "red"
  }
}

Die Rahmenfarbe von Feldern in der Symbolleiste.

Sie legt auch die Rahmenfarbe des Felds Auf dieser Seite suchen fest.

"theme": {
  "colors": {
    "frame": "black",
    "toolbar": "black",
    "tab_background_text": "white",
    "toolbar_field": "black",
    "toolbar_field_text": "white",
    "toolbar_field_border": "red"
  }
}

Die Rahmenfarbe fokussierter Felder in der Symbolleiste.

"theme": {
  "colors": {
    "frame": "black",
    "toolbar": "black",
    "tab_background_text": "white",
    "toolbar_field": "black",
    "toolbar_field_text": "white",
    "toolbar_field_border_focus": "red"
  }
}

Die Hintergrundfarbe fokussierter Felder in der Symbolleiste, beispielsweise der URL-Leiste.

"theme": {
  "colors": {
    "frame": "black",
    "toolbar": "black",
    "tab_background_text": "white",
    "toolbar_field": "black",
    "toolbar_field_text": "white",
    "toolbar_field_focus": "red"
  }
}

"theme": {
  "colors": {
    "toolbar_field": "rgb(255 255 255 / 91%)",
    "toolbar_field_text": "rgb(0 100 0)",
    "toolbar_field_highlight": "rgb(180 240 180 / 90%)",
    "toolbar_field_highlight_text": "rgb(0 80 0)"
  }
}

Hier legt das Feld toolbar_field_highlight ein helles Grün als Markierungsfarbe fest, während toolbar_field_highlight_text die Textfarbe auf ein mittleres bis dunkles Grün setzt.

Die Farbe von aktuell ausgewähltem Text in der URL-Leiste (und in der Suchleiste, falls diese als separates Feld konfiguriert ist).

"theme": {
  "colors": {
    "toolbar_field": "rgb(255 255 255 / 91%)",
    "toolbar_field_text": "rgb(0 100 0)",
    "toolbar_field_highlight": "rgb(180 240 180 / 90%)",
    "toolbar_field_highlight_text": "rgb(0 80 0)"
  }
}

Hier setzt das Feld toolbar_field_highlight_text die Textfarbe auf ein mittleres bis dunkles Grün, während die Markierungsfarbe hellgrün ist.

Die Farbe von Trennlinien innerhalb der URL-Leiste. In Firefox 58 wurde dies über toolbar_vertical_separator umgesetzt.

"theme": {
  "colors": {
    "frame": "black",
    "toolbar": "black",
    "tab_background_text": "white",
    "toolbar_field_separator": "red"
  }
}

In diesem Screenshot ist "toolbar_vertical_separator" die rote vertikale Linie in der URL-Leiste, die das Symbol für den Lesemodus von den anderen Symbolen trennt.

Die Textfarbe in Feldern der Symbolleiste, beispielsweise in der URL-Leiste. Sie legt auch die Textfarbe im Feld Auf dieser Seite suchen fest.

"theme": {
  "colors": {
    "frame": "black",
    "toolbar": "black",
    "tab_background_text": "white",
    "toolbar_field": "black",
    "toolbar_field_text": "red"
  }
}

Die Textfarbe in fokussierten Feldern der Symbolleiste, beispielsweise in der URL-Leiste.

"theme": {
  "colors": {
    "frame": "black",
    "toolbar": "black",
    "tab_background_text": "white",
    "toolbar_field": "black",
    "toolbar_field_text": "white",
    "toolbar_field_text_focus": "red"
  }
}

Die Textfarbe der Symbolleiste. Sie legt auch die Textfarbe der Suchleiste fest.

"theme": {
  "colors": {
    "frame": "black",
    "tab_background_text": "white",
    "toolbar": "black",
    "toolbar_text": "red"
  }
}

Die Farbe der Linie, die den oberen Rand der Symbolleiste vom darüberliegenden Bereich trennt.

"theme": {
  "colors": {
    "frame": "black",
    "tab_background_text": "white",
    "toolbar": "black",
    "toolbar_top_separator": "red"
  }
}

Die Farbe der Trennlinie in der Lesezeichen-Symbolleiste. In Firefox 58 entspricht sie der Farbe von Trennlinien innerhalb der URL-Leiste.

"theme": {
  "colors": {
    "frame": "black",
    "tab_background_text": "white",
    "toolbar": "black",
    "toolbar_vertical_separator": "red"
  }
}

Array aus String-Werten

Optional

Ein Array von Aufzählungswerten, die die Ausrichtung des jeweiligen Elements im Array "additional_backgrounds": festlegen.
Mögliche Werte sind:

• "bottom"
• "center"
• "left"
• "right"
• "top"
• "center bottom"
• "center center"
• "center top"
• "left bottom"
• "left center"
• "left top"
• "right bottom"
• "right center"
• "right top".

Enthält das Array weniger Elemente als das Array additional_backgrounds, werden seine Werte für die fehlenden Einträge erneut verwendet. Enthält additional_backgrounds beispielsweise 5 Werte und additional_backgrounds_alignment den Wert ["left", "top"], wird der dritte Hintergrund mit "left", der vierte mit "top" und der fünfte wieder mit "left" ausgerichtet.

Ohne Angabe gilt standardmäßig "right top".

Array aus String-Werten

Optional

Ein Array von Aufzählungswerten, die festlegen, wie das jeweilige Element im Array "additional_backgrounds": wiederholt wird. Mögliche Werte sind:

• "no-repeat"
• "repeat"
• "repeat-x"
• "repeat-y"

Enthält das Array weniger Elemente als das Array additional_backgrounds, werden seine Werte für die fehlenden Einträge erneut verwendet. Enthält additional_backgrounds beispielsweise 5 Werte und additional_backgrounds_tiling den Wert ["no-repeat", "repeat-x"], wird für den dritten Hintergrund "no-repeat", für den vierten "repeat-x" und für den fünften wieder "no-repeat" verwendet.

Ohne Angabe gilt standardmäßig "no-repeat".

Array aus String-Werten

Optional

Ein Array von Werten, die die Größe des jeweiligen Elements im Array "additional_backgrounds": festlegen. Es akzeptiert dieselben Werte wie die CSS-Eigenschaft background-size, etwa "auto", "cover", "contain" oder explizite Werte für Breite und Höhe (beispielsweise "100px 200px").

Enthält das Array weniger Elemente als das Array additional_backgrounds, werden seine Werte für die fehlenden Einträge erneut verwendet. Enthält additional_backgrounds beispielsweise 5 Werte und additional_backgrounds_size den Wert ["auto", "100px 100px"], erhält der dritte Hintergrund die Größe "auto", der vierte "100px 100px" und der fünfte wieder "auto".

Ohne Angabe gilt standardmäßig "auto".

String

Optional

Bestimmt den Bereich des Browserfensters, in dem die Hintergrundbilder und -farbverläufe des Themes gezeichnet werden. Mögliche Werte sind:

• "auto" – Firefox wählt den Bereich anhand von additional_backgrounds_alignment aus. Wenn ein Ausrichtungswert einen Hintergrund vertikal in der Mitte oder am unteren Rand des Header-Bereichs positioniert, werden die Hintergründe in den oberen Symbolleisten gezeichnet. Andernfalls werden sie im gesamten Fenster gezeichnet.
• "window" – die Hintergründe werden im gesamten Browserfenster gezeichnet, sodass sie sich auch hinter vertikalen Elementen der Benutzeroberfläche wie der Sidebar und vertikalen Tabs erstrecken.
• "top_toolbars" – die Hintergründe werden nur in den horizontalen Symbolleisten am oberen Fensterrand gezeichnet, also in der Menüleiste, der Tableiste, der Navigationsleiste und der Lesezeichen-Symbolleiste. Vertikale Elemente der Benutzeroberfläche wie die Sidebar verwenden stattdessen die Farbe frame.

Ohne Angabe gilt standardmäßig "auto".

String

Optional

Bestimmt, welches Farbschema auf die Browseroberfläche (beispielsweise Kontextmenüs) und Inhalte (beispielsweise integrierte Seiten und das bevorzugte Farbschema für Webseiten) angewendet wird. Mögliche Werte sind:

• "auto" – ein anhand des Themes automatisch ausgewähltes helles oder dunkles Farbschema.
• "light" – ein helles Farbschema.
• "dark" – ein dunkles Farbschema.
• "system" – verwendet das Farbschema des Systems.

Ohne Angabe gilt standardmäßig "auto".

String

Optional

Bestimmt, welches Farbschema auf Inhalte angewendet wird (beispielsweise integrierte Seiten und das bevorzugte Farbschema für Webseiten). Überschreibt color_scheme. Mögliche Werte sind:

• "auto" – ein anhand des Themes automatisch ausgewähltes helles oder dunkles Farbschema.
• "light" – ein helles Farbschema.
• "dark" – ein dunkles Farbschema.
• "system" – das Farbschema des Systems.

Ohne Angabe gilt standardmäßig "auto".