diff --git a/docs/themes/navy/layout/partial/after_footer.swig b/docs/themes/navy/layout/partial/after_footer.swig
index 8c36be6fb..e6778541a 100644
--- a/docs/themes/navy/layout/partial/after_footer.swig
+++ b/docs/themes/navy/layout/partial/after_footer.swig
@@ -17,12 +17,10 @@ debug: false
 });
 </script>
 
-<!-- Google tag (gtag.js) -->
 <script async src="https://www.googletagmanager.com/gtag/js?id=G-GM713991QQ"></script>
-<script>
+<script type="text/plain" data-category="analytics">
   window.dataLayer = window.dataLayer || [];
   function gtag(){dataLayer.push(arguments);}
   gtag('js', new Date());
-
   gtag('config', 'G-GM713991QQ');
 </script>
\ No newline at end of file
diff --git a/docs/themes/navy/layout/partial/footer.swig b/docs/themes/navy/layout/partial/footer.swig
index 09753d621..ba66a2353 100644
--- a/docs/themes/navy/layout/partial/footer.swig
+++ b/docs/themes/navy/layout/partial/footer.swig
@@ -5,6 +5,7 @@
       {{__('footer.license')}}
     </div>
     <div id="footer-links">
+      <button type="button" class="footer-link cookie-preferences" data-cc="show-consentModal" title="Manage cookie preferences"><i class="icon-shield"></i></button>
       <a href="https://twitter.com/{{ config.twitter }}" class="footer-link" target="_blank"><i class="icon-twitter"></i></a>
       <a href="https://opencollective.com/{{ config.oc }}" class="footer-link" target="_blank"><i class="icon-opencollective"></i></a>
       <a href="https://github.com/{{ config.github }}" class="footer-link" target="_blank"><i class="icon-github"></i></a>
diff --git a/docs/themes/navy/layout/partial/head.swig b/docs/themes/navy/layout/partial/head.swig
index ce443bb30..1e85aa221 100644
--- a/docs/themes/navy/layout/partial/head.swig
+++ b/docs/themes/navy/layout/partial/head.swig
@@ -32,12 +32,7 @@
   <meta name="msapplication-TileImage" content="{{ url_for('icon/mstile-144x144.png') }}">
   {{ css('css/navy') }}
   {{ feed_tag('atom.xml') }}
-  <script src="https://cdn.cookiehub.eu/c2/e8e44c93.js"></script>
-  <script type="text/javascript">
-  document.addEventListener("DOMContentLoaded", function(event) {
-    if (location.hostname === 'localhost' || location.hostname === '127.0.0.1') return;
-    var cpm = {};
-    window.cookiehub.load(cpm);
-  });
-  </script>
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/orestbida/cookieconsent@3.1.0/dist/cookieconsent.css">
+  <script src="https://cdn.jsdelivr.net/gh/orestbida/cookieconsent@3.1.0/dist/cookieconsent.umd.js"></script>
+  {{ js('js/cookieconsent-config') }}
 </head>
diff --git a/docs/themes/navy/source/css/_partial/cookieconsent.styl b/docs/themes/navy/source/css/_partial/cookieconsent.styl
new file mode 100644
index 000000000..3e6eb84f4
--- /dev/null
+++ b/docs/themes/navy/source/css/_partial/cookieconsent.styl
@@ -0,0 +1,15 @@
+#cc-main
+  --cc-btn-primary-bg: var(--color-link)
+  --cc-btn-primary-color: #fff
+  --cc-btn-primary-border-color: var(--color-link)
+  --cc-btn-primary-hover-bg: var(--color-link-hover)
+  --cc-btn-primary-hover-border-color: var(--color-link-hover)
+  --cc-btn-secondary-bg: #eaeff2
+  --cc-btn-secondary-color: var(--color-default)
+  --cc-btn-secondary-border-color: #eaeff2
+  --cc-toggle-on-bg: var(--color-link)
+
+.cc--darkmode #cc-main
+  --cc-btn-secondary-bg: #3a4248
+  --cc-btn-secondary-color: var(--color-default)
+  --cc-btn-secondary-border-color: #3a4248
diff --git a/docs/themes/navy/source/css/_partial/footer.styl b/docs/themes/navy/source/css/_partial/footer.styl
index e5914c7be..2cb312c84 100644
--- a/docs/themes/navy/source/css/_partial/footer.styl
+++ b/docs/themes/navy/source/css/_partial/footer.styl
@@ -42,6 +42,13 @@
   @media mq-normal
     font-size: 30px
 
+.cookie-preferences
+  background: none
+  border: 0
+  padding: 0
+  cursor: pointer
+  color: inherit
+
 .icon-oc
   height: 36px
   width: 30px
diff --git a/docs/themes/navy/source/css/navy.styl b/docs/themes/navy/source/css/navy.styl
index 79bf3f7f3..40c4f448d 100644
--- a/docs/themes/navy/source/css/navy.styl
+++ b/docs/themes/navy/source/css/navy.styl
@@ -9,6 +9,7 @@
 @import "_partial/page"
 @import "_partial/mobile_nav"
 @import "_partial/footer"
+@import "_partial/cookieconsent"
 @import "_partial/highlight"
 @import "_partial/icomoon.css"
 @import "_partial/docsearch.min.css"
\ No newline at end of file
diff --git a/docs/themes/navy/source/js/cookieconsent-config.js b/docs/themes/navy/source/js/cookieconsent-config.js
new file mode 100644
index 000000000..81a7f9bbf
--- /dev/null
+++ b/docs/themes/navy/source/js/cookieconsent-config.js
@@ -0,0 +1,49 @@
+(function () {
+  if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
+    document.documentElement.classList.add('cc--darkmode');
+  }
+
+  var config = {
+    guiOptions: {
+      consentModal: {
+        equalWeightButtons: false
+      }
+    },
+    categories: {
+      necessary: {
+        enabled: true,
+        readOnly: true
+      },
+      analytics: {
+        enabled: false
+      }
+    },
+    language: {
+      default: 'en',
+      translations: {
+        en: {
+          consentModal: {
+            title: 'We use cookies',
+            description: 'This site uses cookies for analytics and to improve your experience.',
+            acceptAllBtn: 'Accept',
+            acceptNecessaryBtn: 'Reject'
+          }
+        }
+      }
+    }
+  };
+
+  if (/^localhost$|^127\.0\.0\.1$/i.test(location.hostname)) {
+    config.cookie = { secure: false };
+  }
+
+  function run() {
+    CookieConsent.run(config);
+  }
+
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', run);
+  } else {
+    run();
+  }
+}());