diff --git a/assets/sass/_theme/_configuration.sass b/assets/sass/_theme/_configuration.sass
index 2ae9294c92a72b7f643fafd7859c378b16c2ad8f..ac0316052466a0a02bbea4eeead6bb4f0db1de84 100644
--- a/assets/sass/_theme/_configuration.sass
+++ b/assets/sass/_theme/_configuration.sass
@@ -172,6 +172,7 @@ $header-logo-height: 32px !default
 $header-logo-height-md: $header-logo-height !default
 $header-height: 99px !default
 $header-height-md: 74px !default
+$header-sticky-invert-logo: false !default
 
 // Navs
 $body-overlay-color: rgba(0, 0, 0, 0.3) !default
diff --git a/assets/sass/_theme/design-system/header.sass b/assets/sass/_theme/design-system/header.sass
index a6c9671d0d18d8bbec3c31ba754f44933f1e64b7..d79a366ebd3af3607dbf0244208289bdcb116e3b 100644
--- a/assets/sass/_theme/design-system/header.sass
+++ b/assets/sass/_theme/design-system/header.sass
@@ -37,6 +37,9 @@ header[role="banner"]
                 text-decoration-color: transparent
             span
                 color: $header-sticky-color
+        @if $header-sticky-invert-logo
+            .logo img
+                filter: invert(1)
     html.is-scrolling-down:not(.has-menu-opened) &
         @include media-breakpoint-down(md)
             transform: translateY(-100%)
@@ -48,5 +51,7 @@ header[role="banner"]
             display: block
             height: $header-logo-height
             width: auto
+            @if $header-sticky-invert-logo
+                transition: filter $header-sticky-transition
             @include media-breakpoint-up(md)
                 height: $header-logo-height-md