diff --git a/addons/website/static/src/scss/website.scss b/addons/website/static/src/scss/website.scss
index af7f2f1f52c..2d2b58a9720 100644
--- a/addons/website/static/src/scss/website.scss
+++ b/addons/website/static/src/scss/website.scss
@@ -1320,8 +1320,9 @@ span.list-inline-item.o_add_language:last-child {
 // Footer scrolltop button
 @if o-website-value('footer-scrolltop') {
     #o_footer_scrolltop {
-        $-footer-color: o-color('footer-custom') or o-color('footer');
-        $-copyright-color: o-color('copyright-custom') or o-color('copyright');
+        $-footer-color: o-color('footer-custom') or o-color('footer') or rgba(0, 0, 0, 0);
+        $-footer-color: mix(rgba($-footer-color, 1.0), $body-bg, percentage(alpha($-footer-color)));
+        $-copyright-color: o-color('copyright-custom') or o-color('copyright') or rgba(0, 0, 0, 0);
         $-copyright-color: mix(rgba($-copyright-color, 1.0), $-footer-color, percentage(alpha($-copyright-color)));
 
         box-sizing: content-box;
@@ -1329,8 +1330,7 @@ span.list-inline-item.o_add_language:last-child {
         height: 3rem;
         border: 0;
         padding: 0;
-        @include o-apply-colors('footer', $with-extras: false, $background: $-footer-color);
-        @include o-apply-colors('footer-custom', $with-extras: false, $background: $-footer-color);
+        @include o-apply-colors($-footer-color, $with-extras: false, $background: $-footer-color);
         text-decoration: none;
 
         @if $-footer-color == $-copyright-color {