--- a/toolkit/components/extensions/test/browser/browser.ini
+++ b/toolkit/components/extensions/test/browser/browser.ini
@@ -1,13 +1,14 @@
 [DEFAULT]
 support-files =
   head.js
 
 [browser_ext_management_themes.js]
+[browser_ext_themes_alpha_accentcolor.js]
 [browser_ext_themes_chromeparity.js]
 [browser_ext_themes_dynamic_getCurrent.js]
 [browser_ext_themes_dynamic_onUpdated.js]
 [browser_ext_themes_dynamic_updates.js]
 [browser_ext_themes_getCurrent_differentExt.js]
 [browser_ext_themes_lwtsupport.js]
 [browser_ext_themes_multiple_backgrounds.js]
 [browser_ext_themes_persistence.js]

new file mode 100644
--- /dev/null
+++ b/toolkit/components/extensions/test/browser/browser_ext_themes_alpha_accentcolor.js
@@ -0,0 +1,30 @@
+"use strict";
+
+add_task(async function test_alpha_accentcolor() {
+  let extension = ExtensionTestUtils.loadExtension({
+    manifest: {
+      "theme": {
+        "images": {
+          "headerURL": "image1.png",
+        },
+        "colors": {
+          "accentcolor": "rgba(230, 128, 0, 0.1)",
+          "textcolor": TEXT_COLOR,
+        },
+      },
+    },
+    files: {
+      "image1.png": BACKGROUND,
+    },
+  });
+
+  await extension.startup();
+
+  let docEl = window.document.documentElement;
+  let style = window.getComputedStyle(docEl);
+
+  Assert.equal(style.backgroundColor, "rgb(230, 128, 0)",
+               "Window background color should be opaque");
+
+  await extension.unload();
+});

--- a/toolkit/modules/LightweightThemeConsumer.jsm
+++ b/toolkit/modules/LightweightThemeConsumer.jsm
@@ -122,23 +122,24 @@ LightweightThemeConsumer.prototype = {
     let root = this._doc.documentElement;
     let active = !!aData.headerURL;
 
     // We need to clear these either way: either because the theme is being removed,
     // or because we are applying a new theme and the data might be bogus CSS,
     // so if we don't reset first, it'll keep the old value.
     root.style.removeProperty("--lwt-text-color");
     root.style.removeProperty("--lwt-accent-color");
-    let textcolor = this._sanitizeCSSColor(aData.textcolor) || "black";
+    let textcolor = aData.textcolor || "black";
     _setProperty(root, active, "--lwt-text-color", textcolor);
     _setProperty(root, active, "--lwt-accent-color", this._sanitizeCSSColor(aData.accentcolor) || "white");
+
     if (active) {
       let dummy = this._doc.createElement("dummy");
       dummy.style.color = textcolor;
-      let [r, g, b] = _parseRGB(this._doc.defaultView.getComputedStyle(dummy).color);
+      let [r, g, b] = _parseRGB(this._win.getComputedStyle(dummy).color);
       let luminance = 0.2125 * r + 0.7154 * g + 0.0721 * b;
       root.setAttribute("lwthemetextcolor", luminance <= 110 ? "dark" : "bright");
       root.setAttribute("lwtheme", "true");
     } else {
       root.removeAttribute("lwthemetextcolor");
       root.removeAttribute("lwtheme");
     }
 
@@ -168,22 +169,23 @@ LightweightThemeConsumer.prototype = {
                                  JSON.stringify(aData));
   },
 
   _sanitizeCSSColor(cssColor) {
     // style.color normalizes color values and rejects invalid ones, so a
     // simple round trip gets us a sanitized color value.
     let span = this._doc.createElementNS("http://www.w3.org/1999/xhtml", "span");
     span.style.color = cssColor;
-    cssColor = span.style.color;
-    if (cssColor == "transparent" ||
-        cssColor == "rgba(0, 0, 0, 0)") {
+    cssColor = this._win.getComputedStyle(span).color;
+    if (cssColor == "rgba(0, 0, 0, 0)" ||
+        !cssColor) {
       return "";
     }
-    return cssColor;
+    // Remove alpha channel from color
+    return `rgb(${_parseRGB(cssColor).join(", ")})`;
   }
 };
 
 function _setImage(aRoot, aActive, aVariableName, aURLs) {
   if (aURLs && !Array.isArray(aURLs)) {
     aURLs = [aURLs];
   }
   _setProperty(aRoot, aActive, aVariableName, aURLs && aURLs.map(v => `url("${v.replace(/"/g, '\\"')}")`).join(","));