diff --git a/common/static/common/styles/_extension.sass b/common/static/common/styles/_extension.sass
index fe8eb160..49f81f11 100644
--- a/common/static/common/styles/_extension.sass
+++ b/common/static/common/styles/_extension.sass
@@ -27,7 +27,7 @@
 
   .hero-overlay
     background-color: transparent
-    background-image: linear-gradient(0deg, var(--color-bg), hsla(213, 10%, 14%, 0))
+    background-image: linear-gradient(0deg, hsl(213, 10%, 12%), hsla(213, 10%, 14%, 0)) // --color-bg theme dark
 
   &.extension-review
     --hero-min-height: 21.0rem
diff --git a/common/static/common/styles/_hero.sass b/common/static/common/styles/_hero.sass
index 0bb42568..98a059b2 100644
--- a/common/static/common/styles/_hero.sass
+++ b/common/static/common/styles/_hero.sass
@@ -6,6 +6,8 @@
     --hero-max-height: 0
     --hero-min-height: 24.0rem
     background: transparent
+    color: var(--color-text)
+    text-shadow: none
 
     .hero-content
       margin-top: initial
diff --git a/common/static/common/styles/_list.sass b/common/static/common/styles/_list.sass
index 5a50db3b..0e141fe9 100644
--- a/common/static/common/styles/_list.sass
+++ b/common/static/common/styles/_list.sass
@@ -12,7 +12,7 @@
 
 .list-filters
   +box-card
-  background-color: var(--color-bg-tertiary)
+  background-color: var(--color-bg-primary)
   +padding(3)
 
   h3
diff --git a/common/static/common/styles/main.sass b/common/static/common/styles/main.sass
index 98707cd0..dd2e2c6c 100644
--- a/common/static/common/styles/main.sass
+++ b/common/static/common/styles/main.sass
@@ -9,6 +9,7 @@ $container-width: map-get($container-max-widths, 'xl')
 
 /* Web Assets. */
 @import '../../../../assets_shared/src/styles/main.sass'
+@import '../../../../assets_shared/src/styles/_theme_system.sass'
 
 /* Extension Platform specific styling. */
 @import '_mixins.sass'
diff --git a/common/templates/common/base.html b/common/templates/common/base.html
index 5fc40ca3..6ab0caf9 100644
--- a/common/templates/common/base.html
+++ b/common/templates/common/base.html
@@ -107,6 +107,9 @@
           </ul>
 
           <ul class="nav-global-links-right">
+            <li>
+              <button class="js-toggle-theme-btn px-2"><i class="js-toggle-theme-btn-icon i-adjust"></i></button>
+            </li>
             <li>
               <search>
                 <form action="{% url "extensions:search" %}" method="GET" class="navbar-search">
diff --git a/ratings/static/ratings/styles/_stars.sass b/ratings/static/ratings/styles/_stars.sass
index 724f7210..97dc4985 100644
--- a/ratings/static/ratings/styles/_stars.sass
+++ b/ratings/static/ratings/styles/_stars.sass
@@ -1,5 +1,5 @@
 \:root
-  --stars-bg: hsla(213, 40%, 100%, .2)
+  --stars-bg: var(--color-bg-secondary)
   --stars-bg-highlight: hsl(42, 86%, 48%)
   --stars-bg-hover: hsl(42, 86%, 54%)