diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index 908f94e3..ecef9eb7 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -158,7 +158,7 @@ export function Navbar({ children }: { children: React.ReactNode }) {
   const navbar = (
     <div
       className={twMerge(
-        'w-full p-2 fixed top-0 z-[100] bg-white/70 dark:bg-black/70 backdrop-br-lg shadow-xl shadow-black/3',
+        'w-full p-2 fixed top-0 z-[100] bg-white/70 dark:bg-black/70 backdrop-blur-lg shadow-xl shadow-black/3',
         'flex items-center justify-between gap-4',
         'dark:border-b border-gray-500/20',
       )}
@@ -564,7 +564,7 @@ export function Navbar({ children }: { children: React.ReactNode }) {
 
   const smallMenu = showMenu ? (
     <div
-      className="lg:hidden bg-white/50 dark:bg-black/60 backdrop-br-[20px] z-50
+      className="lg:hidden bg-white/50 dark:bg-black/60 backdrop-blur-[20px] z-50
     fixed top-[var(--navbar-height)] left-0 right-0 max-h-[calc(100dvh-var(--navbar-height))] overflow-y-auto
     "
     >
@@ -610,7 +610,7 @@ export function Navbar({ children }: { children: React.ReactNode }) {
           inlineMenu
             ? ''
             : [
-                'fixed bg-white/70 dark:bg-black/50 backdrop-br-lg -translate-x-full',
+                'fixed bg-white/70 dark:bg-black/50 backdrop-blur-lg -translate-x-full',
                 showMenu && 'translate-x-0',
               ],
         )}