diff --git a/package-lock.json b/package-lock.json
index 9351b736d..d9b770e18 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5629,8 +5629,7 @@
     "node_modules/@testim/chrome-version": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/@testim/chrome-version/-/chrome-version-1.1.4.tgz",
-      "integrity": "sha512-kIhULpw9TrGYnHp/8VfdcneIcxKnLixmADtukQRtJUmsVlMg0niMkwV0xZmi8hqa57xqilIHjWFA0GKvEjVU5g==",
-      "dev": true
+      "integrity": "sha512-kIhULpw9TrGYnHp/8VfdcneIcxKnLixmADtukQRtJUmsVlMg0niMkwV0xZmi8hqa57xqilIHjWFA0GKvEjVU5g=="
     },
     "node_modules/@transifex/api": {
       "version": "4.2.5",
@@ -5916,7 +5915,6 @@
     },
     "node_modules/@types/yauzl": {
       "version": "2.10.0",
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "dependencies": {
@@ -6184,7 +6182,6 @@
     },
     "node_modules/agent-base": {
       "version": "6.0.2",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "debug": "4"
@@ -6195,7 +6192,6 @@
     },
     "node_modules/agent-base/node_modules/debug": {
       "version": "4.3.4",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ms": "2.1.2"
@@ -6211,7 +6207,6 @@
     },
     "node_modules/agent-base/node_modules/ms": {
       "version": "2.1.2",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/aggregate-error": {
@@ -6812,7 +6807,6 @@
       "version": "1.6.2",
       "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.2.tgz",
       "integrity": "sha512-7i24Ri4pmDRfJTR7LDBhsOTtcm+9kjX5WiY1X3wIisx6G9So3pfMkEiU7emUBe46oceVImccTEM3k6C5dbVW8A==",
-      "dev": true,
       "dependencies": {
         "follow-redirects": "^1.15.0",
         "form-data": "^4.0.0",
@@ -6823,7 +6817,6 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
       "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
-      "dev": true,
       "dependencies": {
         "asynckit": "^0.4.0",
         "combined-stream": "^1.0.8",
@@ -8345,8 +8338,7 @@
     "node_modules/compare-versions": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-6.1.0.tgz",
-      "integrity": "sha512-LNZQXhqUvqUTotpZ00qLSaify3b4VFD588aRr8MKFw4CMUr98ytzCW5wDH5qx/DEY5kCDXcbcRuCqL0szEf2tg==",
-      "dev": true
+      "integrity": "sha512-LNZQXhqUvqUTotpZ00qLSaify3b4VFD588aRr8MKFw4CMUr98ytzCW5wDH5qx/DEY5kCDXcbcRuCqL0szEf2tg=="
     },
     "node_modules/component-emitter": {
       "version": "1.3.0",
@@ -11759,7 +11751,6 @@
     },
     "node_modules/extract-zip": {
       "version": "2.0.1",
-      "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
         "debug": "^4.1.1",
@@ -11778,7 +11769,6 @@
     },
     "node_modules/extract-zip/node_modules/debug": {
       "version": "4.3.4",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ms": "2.1.2"
@@ -11794,7 +11784,6 @@
     },
     "node_modules/extract-zip/node_modules/get-stream": {
       "version": "5.2.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "pump": "^3.0.0"
@@ -11808,12 +11797,10 @@
     },
     "node_modules/extract-zip/node_modules/ms": {
       "version": "2.1.2",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/extract-zip/node_modules/pump": {
       "version": "3.0.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "end-of-stream": "^1.1.0",
@@ -12295,7 +12282,6 @@
       "version": "1.15.3",
       "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.3.tgz",
       "integrity": "sha512-1VzOtuEM8pC9SFU1E+8KfTjZyMztRsgEfwQl44z8A25uy13jSzTj6dyK2Df52iV0vgHCfBwLhDWevLn95w5v6Q==",
-      "dev": true,
       "funding": [
         {
           "type": "individual",
@@ -14193,7 +14179,6 @@
     },
     "node_modules/https-proxy-agent": {
       "version": "5.0.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "agent-base": "6",
@@ -14205,7 +14190,6 @@
     },
     "node_modules/https-proxy-agent/node_modules/debug": {
       "version": "4.3.4",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ms": "2.1.2"
@@ -14221,7 +14205,6 @@
     },
     "node_modules/https-proxy-agent/node_modules/ms": {
       "version": "2.1.2",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/hull.js": {
@@ -15116,7 +15099,6 @@
     },
     "node_modules/is-url": {
       "version": "1.2.4",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/is-utf8": {
@@ -15173,7 +15155,6 @@
     },
     "node_modules/is2": {
       "version": "2.0.7",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "deep-is": "^0.1.3",
@@ -15186,7 +15167,6 @@
     },
     "node_modules/is2/node_modules/ip-regex": {
       "version": "4.3.0",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -21894,7 +21874,6 @@
     },
     "node_modules/proxy-from-env": {
       "version": "1.1.0",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/prr": {
@@ -23164,18 +23143,41 @@
     },
     "node_modules/scratch-blocks": {
       "version": "0.1.0",
-      "resolved": "git+ssh://git@github.com/TurboWarp/scratch-blocks.git#08e2b86512e2fd5d8589787b798b8dbe5f3f6625",
+      "resolved": "git+ssh://git@github.com/TurboWarp/scratch-blocks.git#b98fa7f2bfcc13d5fc8f5ef817f58e329602e558",
       "license": "GPL-3.0",
       "dependencies": {
+        "chromedriver": "^118.0.1",
         "exports-loader": "0.7.0",
         "google-closure-library": "20190301.0.0",
         "imports-loader": "0.8.0",
-        "scratch-l10n": "3.15.20221022032111"
+        "scratch-l10n": "3.16.20231013034330"
+      }
+    },
+    "node_modules/scratch-blocks/node_modules/chromedriver": {
+      "version": "118.0.1",
+      "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-118.0.1.tgz",
+      "integrity": "sha512-GlGfyRE47IuSJnuadIiDy89EMDMQFBVWxUmiclLJKzQhFsiWAtcIr/mNOxjljZdsw9IwIOQEkrB9wympKYFPLw==",
+      "hasInstallScript": true,
+      "dependencies": {
+        "@testim/chrome-version": "^1.1.3",
+        "axios": "^1.4.0",
+        "compare-versions": "^6.0.0",
+        "extract-zip": "^2.0.1",
+        "https-proxy-agent": "^5.0.1",
+        "proxy-from-env": "^1.1.0",
+        "tcp-port-used": "^1.0.1"
+      },
+      "bin": {
+        "chromedriver": "bin/chromedriver"
+      },
+      "engines": {
+        "node": ">=18"
       }
     },
     "node_modules/scratch-l10n": {
-      "version": "3.15.20221022032111",
-      "license": "BSD-3-Clause",
+      "version": "3.16.20231013034330",
+      "resolved": "https://registry.npmjs.org/scratch-l10n/-/scratch-l10n-3.16.20231013034330.tgz",
+      "integrity": "sha512-zHiSFijBt5Dq7ceLIxEhXvgDn997r3HVXkGjMSQmyA4oyzYwCOVvzoxtu5U2UrxNEcJy7beFLfIn5GrV66/PvQ==",
       "dependencies": {
         "@babel/cli": "^7.1.2",
         "@babel/core": "^7.1.2",
@@ -23191,7 +23193,7 @@
     },
     "node_modules/scratch-paint": {
       "version": "2.1.61",
-      "resolved": "git+ssh://git@github.com/TurboWarp/scratch-paint.git#aaea6c656860a64cff04bb1bc12131bcade2106d",
+      "resolved": "git+ssh://git@github.com/TurboWarp/scratch-paint.git#e28dc7a258d6ef017d78910352825ded022f7602",
       "license": "GPL-3.0",
       "dependencies": {
         "@scratch/paper": "0.11.20221201200345",
@@ -25361,7 +25363,6 @@
     },
     "node_modules/tcp-port-used": {
       "version": "1.0.2",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "debug": "4.3.1",
@@ -25370,7 +25371,6 @@
     },
     "node_modules/tcp-port-used/node_modules/debug": {
       "version": "4.3.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ms": "2.1.2"
@@ -25386,7 +25386,6 @@
     },
     "node_modules/tcp-port-used/node_modules/ms": {
       "version": "2.1.2",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/temp-dir": {
@@ -31966,8 +31965,7 @@
     "@testim/chrome-version": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/@testim/chrome-version/-/chrome-version-1.1.4.tgz",
-      "integrity": "sha512-kIhULpw9TrGYnHp/8VfdcneIcxKnLixmADtukQRtJUmsVlMg0niMkwV0xZmi8hqa57xqilIHjWFA0GKvEjVU5g==",
-      "dev": true
+      "integrity": "sha512-kIhULpw9TrGYnHp/8VfdcneIcxKnLixmADtukQRtJUmsVlMg0niMkwV0xZmi8hqa57xqilIHjWFA0GKvEjVU5g=="
     },
     "@transifex/api": {
       "version": "4.2.5",
@@ -32215,7 +32213,6 @@
     },
     "@types/yauzl": {
       "version": "2.10.0",
-      "dev": true,
       "optional": true,
       "requires": {
         "@types/node": "*"
@@ -32426,21 +32423,18 @@
     },
     "agent-base": {
       "version": "6.0.2",
-      "dev": true,
       "requires": {
         "debug": "4"
       },
       "dependencies": {
         "debug": {
           "version": "4.3.4",
-          "dev": true,
           "requires": {
             "ms": "2.1.2"
           }
         },
         "ms": {
-          "version": "2.1.2",
-          "dev": true
+          "version": "2.1.2"
         }
       }
     },
@@ -32852,7 +32846,6 @@
       "version": "1.6.2",
       "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.2.tgz",
       "integrity": "sha512-7i24Ri4pmDRfJTR7LDBhsOTtcm+9kjX5WiY1X3wIisx6G9So3pfMkEiU7emUBe46oceVImccTEM3k6C5dbVW8A==",
-      "dev": true,
       "requires": {
         "follow-redirects": "^1.15.0",
         "form-data": "^4.0.0",
@@ -32863,7 +32856,6 @@
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
           "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
-          "dev": true,
           "requires": {
             "asynckit": "^0.4.0",
             "combined-stream": "^1.0.8",
@@ -34001,8 +33993,7 @@
     "compare-versions": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-6.1.0.tgz",
-      "integrity": "sha512-LNZQXhqUvqUTotpZ00qLSaify3b4VFD588aRr8MKFw4CMUr98ytzCW5wDH5qx/DEY5kCDXcbcRuCqL0szEf2tg==",
-      "dev": true
+      "integrity": "sha512-LNZQXhqUvqUTotpZ00qLSaify3b4VFD588aRr8MKFw4CMUr98ytzCW5wDH5qx/DEY5kCDXcbcRuCqL0szEf2tg=="
     },
     "component-emitter": {
       "version": "1.3.0"
@@ -36449,7 +36440,6 @@
     },
     "extract-zip": {
       "version": "2.0.1",
-      "dev": true,
       "requires": {
         "@types/yauzl": "^2.9.1",
         "debug": "^4.1.1",
@@ -36459,25 +36449,21 @@
       "dependencies": {
         "debug": {
           "version": "4.3.4",
-          "dev": true,
           "requires": {
             "ms": "2.1.2"
           }
         },
         "get-stream": {
           "version": "5.2.0",
-          "dev": true,
           "requires": {
             "pump": "^3.0.0"
           }
         },
         "ms": {
-          "version": "2.1.2",
-          "dev": true
+          "version": "2.1.2"
         },
         "pump": {
           "version": "3.0.0",
-          "dev": true,
           "requires": {
             "end-of-stream": "^1.1.0",
             "once": "^1.3.1"
@@ -36814,8 +36800,7 @@
     "follow-redirects": {
       "version": "1.15.3",
       "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.3.tgz",
-      "integrity": "sha512-1VzOtuEM8pC9SFU1E+8KfTjZyMztRsgEfwQl44z8A25uy13jSzTj6dyK2Df52iV0vgHCfBwLhDWevLn95w5v6Q==",
-      "dev": true
+      "integrity": "sha512-1VzOtuEM8pC9SFU1E+8KfTjZyMztRsgEfwQl44z8A25uy13jSzTj6dyK2Df52iV0vgHCfBwLhDWevLn95w5v6Q=="
     },
     "for-each": {
       "version": "0.3.3",
@@ -38169,7 +38154,6 @@
     },
     "https-proxy-agent": {
       "version": "5.0.1",
-      "dev": true,
       "requires": {
         "agent-base": "6",
         "debug": "4"
@@ -38177,14 +38161,12 @@
       "dependencies": {
         "debug": {
           "version": "4.3.4",
-          "dev": true,
           "requires": {
             "ms": "2.1.2"
           }
         },
         "ms": {
-          "version": "2.1.2",
-          "dev": true
+          "version": "2.1.2"
         }
       }
     },
@@ -38756,8 +38738,7 @@
       "version": "1.0.0"
     },
     "is-url": {
-      "version": "1.2.4",
-      "dev": true
+      "version": "1.2.4"
     },
     "is-utf8": {
       "version": "0.2.1",
@@ -38795,7 +38776,6 @@
     },
     "is2": {
       "version": "2.0.7",
-      "dev": true,
       "requires": {
         "deep-is": "^0.1.3",
         "ip-regex": "^4.1.0",
@@ -38803,8 +38783,7 @@
       },
       "dependencies": {
         "ip-regex": {
-          "version": "4.3.0",
-          "dev": true
+          "version": "4.3.0"
         }
       }
     },
@@ -43599,8 +43578,7 @@
       }
     },
     "proxy-from-env": {
-      "version": "1.1.0",
-      "dev": true
+      "version": "1.1.0"
     },
     "prr": {
       "version": "1.0.1"
@@ -44509,17 +44487,36 @@
       }
     },
     "scratch-blocks": {
-      "version": "git+ssh://git@github.com/TurboWarp/scratch-blocks.git#08e2b86512e2fd5d8589787b798b8dbe5f3f6625",
+      "version": "git+ssh://git@github.com/TurboWarp/scratch-blocks.git#b98fa7f2bfcc13d5fc8f5ef817f58e329602e558",
       "from": "scratch-blocks@git+https://github.com/TurboWarp/scratch-blocks.git#merge-upstream-builds",
       "requires": {
+        "chromedriver": "^118.0.1",
         "exports-loader": "0.7.0",
         "google-closure-library": "20190301.0.0",
         "imports-loader": "0.8.0",
-        "scratch-l10n": "3.15.20221022032111"
+        "scratch-l10n": "3.16.20231013034330"
+      },
+      "dependencies": {
+        "chromedriver": {
+          "version": "118.0.1",
+          "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-118.0.1.tgz",
+          "integrity": "sha512-GlGfyRE47IuSJnuadIiDy89EMDMQFBVWxUmiclLJKzQhFsiWAtcIr/mNOxjljZdsw9IwIOQEkrB9wympKYFPLw==",
+          "requires": {
+            "@testim/chrome-version": "^1.1.3",
+            "axios": "^1.4.0",
+            "compare-versions": "^6.0.0",
+            "extract-zip": "^2.0.1",
+            "https-proxy-agent": "^5.0.1",
+            "proxy-from-env": "^1.1.0",
+            "tcp-port-used": "^1.0.1"
+          }
+        }
       }
     },
     "scratch-l10n": {
-      "version": "3.15.20221022032111",
+      "version": "3.16.20231013034330",
+      "resolved": "https://registry.npmjs.org/scratch-l10n/-/scratch-l10n-3.16.20231013034330.tgz",
+      "integrity": "sha512-zHiSFijBt5Dq7ceLIxEhXvgDn997r3HVXkGjMSQmyA4oyzYwCOVvzoxtu5U2UrxNEcJy7beFLfIn5GrV66/PvQ==",
       "requires": {
         "@babel/cli": "^7.1.2",
         "@babel/core": "^7.1.2",
@@ -44530,7 +44527,7 @@
       }
     },
     "scratch-paint": {
-      "version": "git+ssh://git@github.com/TurboWarp/scratch-paint.git#aaea6c656860a64cff04bb1bc12131bcade2106d",
+      "version": "git+ssh://git@github.com/TurboWarp/scratch-paint.git#e28dc7a258d6ef017d78910352825ded022f7602",
       "from": "scratch-paint@github:TurboWarp/scratch-paint#merge-upstream",
       "requires": {
         "@scratch/paper": "0.11.20221201200345",
@@ -46163,7 +46160,6 @@
     },
     "tcp-port-used": {
       "version": "1.0.2",
-      "dev": true,
       "requires": {
         "debug": "4.3.1",
         "is2": "^2.0.6"
@@ -46171,14 +46167,12 @@
       "dependencies": {
         "debug": {
           "version": "4.3.1",
-          "dev": true,
           "requires": {
             "ms": "2.1.2"
           }
         },
         "ms": {
-          "version": "2.1.2",
-          "dev": true
+          "version": "2.1.2"
         }
       }
     },
diff --git a/src/components/gui/gui.css b/src/components/gui/gui.css
index 2002e5bb2..b1c2a18cc 100644
--- a/src/components/gui/gui.css
+++ b/src/components/gui/gui.css
@@ -67,6 +67,8 @@
     /* Overrides for react-tabs styling */
     margin: 0 !important;
     border-bottom: 0 !important;
+
+    color: $text-primary;
 }
 
 .tab {
diff --git a/src/components/menu-bar/menu-bar.css b/src/components/menu-bar/menu-bar.css
index 485891646..1b136d12c 100644
--- a/src/components/menu-bar/menu-bar.css
+++ b/src/components/menu-bar/menu-bar.css
@@ -27,8 +27,8 @@
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     font-size: $menu-bar-standard-font-size;
     font-weight: bold;
-    background-color: $looks-secondary;
-    color: $ui-white;
+    background-color: $menu-bar-background;
+    color: $menu-bar-foreground;
 }
 
 .main-menu {
@@ -55,7 +55,6 @@
     display: flex;
     padding: 0 0.25rem;
     text-decoration: none;
-    color: $ui-white;
     user-select: none;
     align-self: center;
     position: relative;
@@ -105,7 +104,8 @@
 }
 
 .feedback-button {
-    background-color: $ui-white;
+    background-color: white;
+    color: inherit;
     height: 34px;
 }
 
diff --git a/src/components/menu/menu.css b/src/components/menu/menu.css
index b9c14d06f..45fc02868 100644
--- a/src/components/menu/menu.css
+++ b/src/components/menu/menu.css
@@ -4,12 +4,11 @@
     position: absolute;
     border: 1px solid $ui-black-transparent;
     border-radius: 0 0 8px 8px;
-    background-color: $looks-secondary;
+    background-color: $menu-bar-background;
     padding: 0;
     margin: 0;
     min-width: 186px;
     overflow: visible;
-    color: $ui-white;
     box-shadow: 0 8px 8px 0 $ui-black-transparent;
 }
 
diff --git a/src/components/modal/modal.css b/src/components/modal/modal.css
index 6beaaf8f6..5bf1e6d35 100644
--- a/src/components/modal/modal.css
+++ b/src/components/modal/modal.css
@@ -10,6 +10,7 @@
     bottom: 0;
     z-index: $z-index-modal;
     background-color: $ui-modal-overlay;
+    color: $ui-modal-foreground;
 }
 
 .modal-content * {
@@ -25,7 +26,6 @@
     user-select: none;
 
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-    color: $text-primary;
     overflow: hidden;
 }
 
@@ -67,7 +67,8 @@ $sides: 20rem;
 
     box-sizing: border-box;
     width: 100%;
-    background-color: $looks-secondary;
+    background-color: $ui-modal-header-background;
+    color: $ui-modal-header-foreground;
 
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     font-size: 1rem;
@@ -79,7 +80,6 @@ $sides: 20rem;
     align-items: center;
     padding: 1rem;
     text-decoration: none;
-    color: $ui-white;
     user-select: none;
 }
 
diff --git a/src/components/prompt/prompt.css b/src/components/prompt/prompt.css
index 71fb7fac7..5ea425fcc 100644
--- a/src/components/prompt/prompt.css
+++ b/src/components/prompt/prompt.css
@@ -58,6 +58,7 @@
     padding: 0.75rem 1rem;
     border-radius: 0.25rem;
     background: white;
+    color: black;
     border: 1px solid $ui-black-transparent;
     font-weight: 600;
     font-size: 0.85rem;
diff --git a/src/components/sprite-info/sprite-info.css b/src/components/sprite-info/sprite-info.css
index 364df9fce..fda14f3af 100644
--- a/src/components/sprite-info/sprite-info.css
+++ b/src/components/sprite-info/sprite-info.css
@@ -4,7 +4,7 @@
 .sprite-info {
     padding: 0.75rem;
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-    background-color: white;
+    background-color: $ui-white;
     color: $text-primary;
     border-top-left-radius: $space;
     border-top-right-radius: $space;
diff --git a/src/components/stage-selector/stage-selector.css b/src/components/stage-selector/stage-selector.css
index f93a0c344..ffa2e28da 100644
--- a/src/components/stage-selector/stage-selector.css
+++ b/src/components/stage-selector/stage-selector.css
@@ -40,7 +40,7 @@ $header-height: calc($stage-menu-height - 2px);
     align-items: center;
     justify-content: center;
     height: $header-height;
-    background-color: white;
+    background-color: $ui-white;
     color: $text-primary;
     border-top-left-radius: $space;
     border-top-right-radius: $space;
diff --git a/src/css/colors.css b/src/css/colors.css
index e3b206fdb..000cdfe11 100644
--- a/src/css/colors.css
+++ b/src/css/colors.css
@@ -3,6 +3,10 @@ $ui-secondary: var(--ui-secondary);
 $ui-tertiary: var(--ui-tertiary);
 
 $ui-modal-overlay: var(--ui-modal-overlay);
+$ui-modal-background: var(--ui-modal-background);
+$ui-modal-foreground: var(--ui-modal-foreground);
+$ui-modal-header-background: var(--ui-modal-header-background);
+$ui-modal-header-foreground: var(--ui-modal-header-foreground);
 
 $ui-white: var(--ui-white);
 $ui-white-dim: var(--ui-white-dim);
@@ -46,3 +50,6 @@ $extensions-transparent: var(--extensions-transparent);
 $extensions-light: var(--extensions-light);
 
 $drop-highlight: var(--drop-highlight);
+
+$menu-bar-background: var(--menu-bar-background);
+$menu-bar-foreground: var(--menu-bar-foreground);
diff --git a/src/lib/themes/default/index.js b/src/lib/themes/default/index.js
index 4eb4ca5ab..93ee62266 100644
--- a/src/lib/themes/default/index.js
+++ b/src/lib/themes/default/index.js
@@ -106,6 +106,10 @@ const guiColors = {
     'ui-tertiary': 'hsla(215, 50%, 90%, 1)', /* #D9E3F2 */
 
     'ui-modal-overlay': 'hsla(215, 100%, 65%, 0.9)', /* 90% transparent version of motion-primary */
+    'ui-modal-background': 'hsla(0, 100%, 100%, 1)', /* #FFFFFF */
+    'ui-modal-foreground': 'hsla(225, 15%, 40%, 1)', /* #575E75 */
+    'ui-modal-header-background': 'hsla(260, 60%, 60%, 1)', /* #855CD6 */
+    'ui-modal-header-foreground': 'hsla(0, 100%, 100%, 1)', /* #FFFFFF */
 
     'ui-white': 'hsla(0, 100%, 100%, 1)', /* #FFFFFF */
     'ui-white-dim': 'hsla(0, 100%, 100%, 0.75)', /* 25% transparent version of ui-white */
@@ -148,7 +152,10 @@ const guiColors = {
     'extensions-transparent': 'hsla(163, 85%, 40%, 0.35)', /* 35% transparent version of extensions-primary */
     'extensions-light': 'hsla(163, 57%, 85%, 1)', /* opaque version of extensions-transparent, on white bg */
 
-    'drop-highlight': 'hsla(215, 100%, 77%, 1)' /* lighter than motion-primary */
+    'drop-highlight': 'hsla(215, 100%, 77%, 1)', /* lighter than motion-primary */
+
+    'menu-bar-background': 'hsla(260, 60%, 60%, 1)', /* #855CD6 */
+    'menu-bar-foreground': 'hsla(0, 100%, 100%, 1)' /* #FFFFFF */
 };
 
 export {
diff --git a/src/lib/themes/guiHelpers.js b/src/lib/themes/guiHelpers.js
index f81adc3fd..d1e224a60 100644
--- a/src/lib/themes/guiHelpers.js
+++ b/src/lib/themes/guiHelpers.js
@@ -1,13 +1,20 @@
 import {themeMap} from '.';
 
 const applyGuiColors = theme => {
+    const doc = document.documentElement;
     const themeObject = themeMap[theme];
 
     for (const [name, value] of Object.entries(themeObject.guiColors)) {
-        document.documentElement.style.setProperty(`--${name}`, value);
+        doc.style.setProperty(`--${name}`, value);
     }
 
-    document.documentElement.style.colorScheme = themeObject.isDark ? 'dark' : 'light';
+    doc.style.setProperty('--paint-ui-pane-border', 'var(--ui-black-transparent)');
+    doc.style.setProperty('--paint-text-primary', 'var(--text-primary)');
+    doc.style.setProperty('--paint-form-border', 'var(--ui-black-transparent)');
+    doc.style.setProperty('--paint-looks-secondary', 'var(--looks-secondary)');
+    doc.style.setProperty('--paint-looks-transparent', 'var(--looks-transparent)');
+
+    doc.style.colorScheme = themeObject.isDark ? 'dark' : 'light';
 
     window.Recolor = {
         primary: themeObject.guiColors['looks-secondary']
diff --git a/src/lib/themes/tw/index.js b/src/lib/themes/tw/index.js
index 48baa5a2f..1f7778cd7 100644
--- a/src/lib/themes/tw/index.js
+++ b/src/lib/themes/tw/index.js
@@ -1,5 +1,6 @@
 const lightGuiColors = {
     'ui-modal-overlay': '#ff4c4ce6',
+    'ui-modal-header-background': '#ff4c4c',
 
     'motion-primary': '#ff4c4c',
     'motion-tertiary': '#cc3333',
@@ -7,7 +8,9 @@ const lightGuiColors = {
     'looks-secondary': '#ff4c4c',
     'looks-transparent': '#ff4d4d59',
     'looks-light-transparent': '#ff4d4d26',
-    'looks-secondary-dark': 'hsla(0, 42%, 51%, 1)'
+    'looks-secondary-dark': 'hsla(0, 42%, 51%, 1)',
+
+    'menu-bar-background': '#ff4c4c'
 };
 
 const darkBlockColors = {
@@ -20,19 +23,25 @@ const darkBlockColors = {
 };
 
 const darkGuiColors = {
+    ...lightGuiColors,
+
     'ui-primary': '#111111',
     'ui-secondary': '#1e1e1e',
     'ui-tertiary': '#2e2e2e',
 
     'ui-modal-overlay': '#333333aa',
+    'ui-modal-background': '#111111',
+    'ui-modal-foreground': '#eeeeee',
+    'ui-modal-header-background': '#333333',
+    'ui-modal-header-foreground': '#ffffff',
+
+    'ui-white': '#1e1e1e',
 
     'ui-black-transparent': '#ffffff26',
 
     'text-primary': '#eeeeee',
 
-    'motion-primary': '#333333',
-
-    'looks-secondary': '#333333'
+    'menu-bar-background': '#333333'
 };
 
 export {