diff --git a/files/en-us/mozilla/add-ons/webextensions/manifest.json/dark_theme/index.md b/files/en-us/mozilla/add-ons/webextensions/manifest.json/dark_theme/index.md new file mode 100644 index 000000000000000..436a58a9d2917b5 --- /dev/null +++ b/files/en-us/mozilla/add-ons/webextensions/manifest.json/dark_theme/index.md @@ -0,0 +1,69 @@ +--- +title: dark_theme +slug: Mozilla/Add-ons/WebExtensions/manifest.json/dark_theme +page-type: webextension-manifest-key +browser-compat: webextensions.manifest.dark_theme +--- + +{{AddonSidebar}} + + + + + + + + + + + + + + + + + + + + +
TypeObject
OptionalNo
Manifest version2 or higher
Example +
+"dark_theme": {
+  "images": {
+    "theme_frame": "images/moon.jpg"
+  },
+  "colors": {
+    "frame": "#CF723F",
+    "tab_background_text": "#000"
+  }
+}
+
+ +Use the `dark_theme` key to define a static theme to apply when Firefox is using the dark color scheme. The `dark_theme` key uses the same syntax and supports the same image, color, and property objects as the `theme` key. + +See the [`theme` key](/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/theme) for more information. + +## Browser compatibility + +{{Compat}} + +### Chrome compatibility + +In Chrome: + +- `colors/toolbar_text` is not used, use `colors/bookmark_text` instead. +- `images/theme_frame` anchors the image to the top left of the header and if the image doesn't fill the header area tile the image. +- all colors must be specified as an array of RGB values, like this: + + ```json + "theme": { + "colors": { + "frame": [255, 0, 0], + "tab_background_text": [0, 255, 0], + "bookmark_text": [0, 0, 255] + } + } + ``` + + The array form and the CSS color form are accepted for all properties. diff --git a/files/en-us/mozilla/add-ons/webextensions/manifest.json/index.md b/files/en-us/mozilla/add-ons/webextensions/manifest.json/index.md index 2e20b4f0b91c8da..54732da40a2928c 100644 --- a/files/en-us/mozilla/add-ons/webextensions/manifest.json/index.md +++ b/files/en-us/mozilla/add-ons/webextensions/manifest.json/index.md @@ -30,6 +30,7 @@ These are the `manifest.json` keys; these keys are available in Manifest V2 and - [commands](/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/commands) - [content_scripts](/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/content_scripts) - [content_security_policy](/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/content_security_policy) +- [dark_theme](/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/dark_theme) - [declarative_net_request](/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/declarative_net_request) - [default_locale](/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/default_locale) - [description](/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/description) diff --git a/files/en-us/mozilla/add-ons/webextensions/manifest.json/theme/index.md b/files/en-us/mozilla/add-ons/webextensions/manifest.json/theme/index.md index 57545f73a5e8dc7..720eca668ef181c 100644 --- a/files/en-us/mozilla/add-ons/webextensions/manifest.json/theme/index.md +++ b/files/en-us/mozilla/add-ons/webextensions/manifest.json/theme/index.md @@ -40,7 +40,7 @@ browser-compat: webextensions.manifest.theme -Use the theme key to define a static theme to apply to Firefox. +Use the `theme` key to define a static theme to apply to Firefox. When provided alone, this defines the theme used when Firefox is using either the light or dark color schemes. If the [`dark_theme` key](/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/dark_theme) key is provided, this key provides the theme used when Firefox is using the light color scheme. > [!NOTE] > If you want to include a theme with an extension, please see the {{WebExtAPIRef("theme")}} API. diff --git a/files/en-us/mozilla/firefox/releases/68/index.md b/files/en-us/mozilla/firefox/releases/68/index.md index 114a4bbeb0cd058..65069ffbb9afef9 100644 --- a/files/en-us/mozilla/firefox/releases/68/index.md +++ b/files/en-us/mozilla/firefox/releases/68/index.md @@ -174,7 +174,7 @@ _No changes._ ### Manifest changes -_No changes._ +- Support added for the [`dark_theme` key](/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/dark_theme). This key enables a static theme to define its looks when Firefox is using the dark color scheme ([Firefox bug 1525762](https://bugzil.la/1525762)). ## See also