diff --git a/ui/packages/consul-ui/app/templates/application.hbs b/ui/packages/consul-ui/app/templates/application.hbs
index 6fb5c38809..b6732a5137 100644
--- a/ui/packages/consul-ui/app/templates/application.hbs
+++ b/ui/packages/consul-ui/app/templates/application.hbs
@@ -1,11 +1,23 @@
 <HeadLayout />
 {{page-title 'Consul' separator=' - '}}
+
 {{#if (env 'CONSUL_ACLS_ENABLED')}}
   {{document-attrs class="has-acls"}}
 {{/if}}
 {{#if (env 'CONSUL_NSPACES_ENABLED')}}
   {{document-attrs class="has-nspaces"}}
 {{/if}}
+
+<DataSource
+  @src="settings://consul:theme"
+as |source|>
+{{#each-in source.data as |key value|}}
+  {{#if (and value (contains key (array "color-scheme" "contrast")))}}
+    {{document-attrs class=(concat 'prefers-' key '-' value)}}
+  {{/if}}
+{{/each-in}}
+</DataSource>
+
 {{#if (not-eq router.currentRouteName 'application')}}
   <HashicorpConsul
     id="wrapper"