diff --git a/assets/main/scss/_palettes.scss b/assets/main/scss/_palettes.scss
index 09c52f67..738b4fa6 100644
--- a/assets/main/scss/_palettes.scss
+++ b/assets/main/scss/_palettes.scss
@@ -95,4 +95,10 @@ $palette-classes: 'btn', 'btn-outline';
   width: 1.5rem;
 }
 
+.palette-dropdown-menu {
+  &.show {
+    display: flex !important;
+  }
+}
+
 /*! purgecss end ignore */
diff --git a/layouts/partials/header/palettes.html b/layouts/partials/header/palettes.html
index d5dd9914..1de33908 100644
--- a/layouts/partials/header/palettes.html
+++ b/layouts/partials/header/palettes.html
@@ -4,9 +4,8 @@
         <i class="fas fa-fw fa-palette"></i>
         <span class="d-xxl-none">{{ i18n "palette" }}</span>
     </a>
-    <ul class="dropdown-menu dropdown-menu-end px-2" aria-labelledby="paletteDropdown">
-        <div class="row">
-            {{- range .Site.Params.Palettes }}
+    <ul class="palette-dropdown-menu dropdown-menu dropdown-menu-end px-2 row g-2" aria-labelledby="paletteDropdown">
+        {{- range .Site.Params.Palettes }}
             {{- $key := replace . " " "-" }}
             {{- $title := replace . " " "_" | printf "color_%s" | i18n }}
             <li class="col-4 my-1">
@@ -14,8 +13,7 @@
                     class="btn btn-sm w-100 palette text-bg-{{ $key }}" data-palette="{{ $key }}">
                 </a>
             </li>
-            {{- end }}
-        </div>
+        {{- end }}
     </ul>
 </li>
 {{- end -}}