diff --git a/web/src/components/HeaderBar.js b/web/src/components/HeaderBar.js
index f8d2db4f..6726820f 100644
--- a/web/src/components/HeaderBar.js
+++ b/web/src/components/HeaderBar.js
@@ -338,7 +338,7 @@ const HeaderBar = () => {
   };
 
   return (
-    <header className="bg-semi-color-bg-0 text-semi-color-text-0 sticky top-0 z-50 transition-colors duration-300">
+    <header className="text-semi-color-text-0 sticky top-0 z-50 transition-colors duration-300 bg-white/75 dark:bg-zinc-900/75 backdrop-blur-lg">
       <div className="w-full px-4">
         <div className="flex items-center justify-between h-16">
           <div className="flex items-center">