diff --git a/addons/mass_mailing/views/mailing_templates_portal_layouts.xml b/addons/mass_mailing/views/mailing_templates_portal_layouts.xml
index c0659daafbf..600d026fb6f 100644
--- a/addons/mass_mailing/views/mailing_templates_portal_layouts.xml
+++ b/addons/mass_mailing/views/mailing_templates_portal_layouts.xml
@@ -4,8 +4,14 @@
     <template id="mass_mailing.layout" name="Mass Mailing Layout">
         <t t-call="web.layout">
             <t t-set="head">
-                <t t-call-assets="web.assets_common"/>
-                <t t-call-assets="web.assets_backend"/>
+                <t t-if="request.httprequest.cookies.get('color_scheme') == 'dark'">
+                    <t t-call-assets="web.dark_mode_assets_common"/>
+                    <t t-call-assets="web.dark_mode_assets_backend"/>
+                </t>
+                <t t-else="">
+                    <t t-call-assets="web.assets_common"/>
+                    <t t-call-assets="web.assets_backend"/>
+                </t>
             </t>
             <body class="o_white_body">
                 <header>
diff --git a/addons/point_of_sale/views/pos_assets_qunit.xml b/addons/point_of_sale/views/pos_assets_qunit.xml
index 35818f16fbd..f494500035c 100644
--- a/addons/point_of_sale/views/pos_assets_qunit.xml
+++ b/addons/point_of_sale/views/pos_assets_qunit.xml
@@ -2,7 +2,12 @@
 <odoo>
 
 <template id="point_of_sale.qunit_suite_assets">
-    <t t-call-assets="web.assets_backend" t-js="false" />
+    <t t-if="request.httprequest.cookies.get('color_scheme') == 'dark'">
+        <t t-call-assets="web.dark_mode_assets_backend" t-js="false"/>
+    </t>
+    <t t-else="">
+        <t t-call-assets="web.assets_backend" t-js="false"/>
+    </t>
     <t t-call-assets="point_of_sale.tests_assets" t-js="false"/>
     <t t-call-assets="point_of_sale.tests_assets" t-css="false"/>
     <style>
diff --git a/addons/web/__manifest__.py b/addons/web/__manifest__.py
index d7a1518906f..c2391df2cf9 100644
--- a/addons/web/__manifest__.py
+++ b/addons/web/__manifest__.py
@@ -515,6 +515,16 @@ This module provides the core of the Odoo Web Client.
             'web/static/src/webclient/actions/reports/reset.min.css',
         ],
 
+        # ---------------------------------------------------------------------
+        # COLOR SCHEME BUNDLES
+        # ---------------------------------------------------------------------
+        "web.dark_mode_assets_common": [
+            ('include', 'web.assets_common'),
+        ],
+        "web.dark_mode_assets_backend": [
+            ('include', 'web.assets_backend'),
+        ],
+
         # ---------------------------------------------------------------------
         # SUB BUNDLES
         # ---------------------------------------------------------------------
diff --git a/addons/web/views/webclient_templates.xml b/addons/web/views/webclient_templates.xml
index 1052f322177..08a7f739afa 100644
--- a/addons/web/views/webclient_templates.xml
+++ b/addons/web/views/webclient_templates.xml
@@ -207,8 +207,14 @@
             <t t-set="html_data" t-value="{'style': 'height: 100%;'}"/>
             <t t-set="title">Web Tests</t>
             <t t-set="head">
-                <t t-call-assets="web.assets_common" t-js="false"/>
-                <t t-call-assets="web.assets_backend" t-js="false"/>
+                <t t-if="request.httprequest.cookies.get('color_scheme') == 'dark'">
+                    <t t-call-assets="web.dark_mode_assets_common" t-js="false"/>
+                    <t t-call-assets="web.dark_mode_assets_backend" t-js="false"/>
+                </t>
+                <t t-else="">
+                    <t t-call-assets="web.assets_common" t-js="false"/>
+                    <t t-call-assets="web.assets_backend" t-js="false"/>
+                </t>
                 <t t-call-assets="web.tests_assets_common" t-css="false"/>
                 <t t-call-assets="web.assets_backend" t-css="false"/>
 
@@ -229,8 +235,14 @@
             <t t-set="head">
                 <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
 
-                <t t-call-assets="web.assets_common" t-js="false"/>
-                <t t-call-assets="web.assets_backend" t-js="false"/>
+                <t t-if="request.httprequest.cookies.get('color_scheme') == 'dark'">
+                    <t t-call-assets="web.dark_mode_assets_common" t-js="false"/>
+                    <t t-call-assets="web.dark_mode_assets_backend" t-js="false"/>
+                </t>
+                <t t-else="">
+                    <t t-call-assets="web.assets_common" t-js="false"/>
+                    <t t-call-assets="web.assets_backend" t-js="false"/>
+                </t>
                 <t t-call-assets="web.tests_assets_common" t-css="false"/>
                 <t t-call-assets="web.assets_backend" t-css="false"/>
 
@@ -252,8 +264,14 @@
                 <script type="text/javascript" src="/web/static/lib/benchmarkjs/lodash.js"></script>
                 <script type="text/javascript" src="/web/static/lib/benchmarkjs/benchmark.js"></script>
 
-                <t t-call-assets="web.assets_common" t-js="false"/>
-                <t t-call-assets="web.assets_backend" t-js="false"/>
+                <t t-if="request.httprequest.cookies.get('color_scheme') == 'dark'">
+                    <t t-call-assets="web.dark_mode_assets_common" t-js="false"/>
+                    <t t-call-assets="web.dark_mode_assets_backend" t-js="false"/>
+                </t>
+                <t t-else="">
+                    <t t-call-assets="web.assets_common" t-js="false"/>
+                    <t t-call-assets="web.assets_backend" t-js="false"/>
+                </t>
                 <t t-call-assets="web.assets_common" t-css="false"/>
                 <t t-call-assets="web.assets_backend" t-css="false"/>
 
@@ -318,8 +336,14 @@
                         fetch(`/web/webclient/translations/${cache_hashes.translations}?lang=${user_context.lang}`);
                     }
                 </script>
-                <t t-call-assets="web.assets_common" t-js="false"/>
-                <t t-call-assets="web.assets_backend" t-js="false"/>
+                <t t-if="request.httprequest.cookies.get('color_scheme') == 'dark'">
+                    <t t-call-assets="web.dark_mode_assets_common" t-js="false"/>
+                    <t t-call-assets="web.dark_mode_assets_backend" t-js="false"/>
+                </t>
+                <t t-else="">
+                    <t t-call-assets="web.assets_common" t-js="false"/>
+                    <t t-call-assets="web.assets_backend" t-js="false"/>
+                </t>
                 <t t-call-assets="web.assets_common" t-css="false"/>
                 <t t-call-assets="web.assets_backend" t-css="false"/>
                 <t t-call-assets="web.assets_backend_prod_only" t-css="false"/>