Ensure color-scheme meta tag is set

material/base.html

@@ -240,7 +240,7 @@
       </script>
     {% endblock %}
     {% block scripts %}
-      <script src="{{ 'assets/javascripts/bundle.b4d07000.min.js' | url }}"></script>
+      <script src="{{ 'assets/javascripts/bundle.a51614de.min.js' | url }}"></script>
       {% for path in config.extra_javascript %}
         {% if path.endswith(".mjs") %}
           <script type="module" src="{{ path | url }}"></script>

src/assets/javascripts/components/palette/index.ts

@@ -119,6 +119,10 @@ export function mountPalette(
   const meta = h("meta", { name: "theme-color" })
   document.head.appendChild(meta)
 
+  // Add color scheme meta tag
+  const scheme = h("meta", { name: "color-scheme" })
+  document.head.appendChild(scheme)
+
   /* Mount component on subscription */
   return defer(() => {
     const push$ = new Subject<Palette>()
@@ -145,10 +149,13 @@ export function mountPalette(
       .pipe(
         map(() => {
           const header = getComponentElement("header")
-          const { backgroundColor } = window.getComputedStyle(header)
+          const style  = window.getComputedStyle(header)
+
+          // Set color scheme
+          scheme.content = style.colorScheme
 
           /* Return color in hexadecimal format */
-          return backgroundColor.match(/\d+/g)!
+          return style.backgroundColor.match(/\d+/g)!
             .map(value => (+value).toString(16).padStart(2, "0"))
             .join("")
         })