diff --git a/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.html b/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.html
index 0db3643d4a..483edf4332 100644
--- a/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.html
+++ b/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.html
@@ -1,5 +1,5 @@
 <button
-  class="group flex items-center justify-center p-1 bg-white opacity-80 shadow-xl text-black rounded hover:opacity-100"
+  class="group flex items-center justify-center p-1 bg-white opacity-80 box-shadow-xl shadow-[4.0px_8.0px_8.0px_rgba(0,0,0,0.38)] mix-blend-luminosity text-black rounded hover:opacity-100"
 >
   <mat-icon class="material-symbols-outlined align-middle">{{ icon }}</mat-icon>
   <span class="mx-2 hidden group-hover:inline">{{ label }}</span>