diff --git a/app/components/Navbar/NavBarMobile.tsx b/app/components/Navbar/NavBarMobile.tsx
index 3431566..e0be96b 100644
--- a/app/components/Navbar/NavBarMobile.tsx
+++ b/app/components/Navbar/NavBarMobile.tsx
@@ -66,7 +66,7 @@ export const NavBarMobile = (props: { setIsSettingModalOpen: any }) => {
 
   return (
     <>
-      <footer className="fixed bottom-0 left-0 right-0 z-50 block w-full h-[70px] font-medium bg-black rounded-t-lg lg:hidden">
+      <footer className="fixed bottom-0 left-0 right-0 z-50 block w-full h-[70px] font-medium text-white bg-black rounded-t-lg lg:hidden">
         <div className="flex items-center justify-center h-full gap-4">
           {NavbarItems.map((item) => {
             if (item.auth && !userStore.isAuth) return <></>;
diff --git a/app/components/Navbar/NavBarPc.tsx b/app/components/Navbar/NavBarPc.tsx
index b8886f4..c9e6a8f 100644
--- a/app/components/Navbar/NavBarPc.tsx
+++ b/app/components/Navbar/NavBarPc.tsx
@@ -61,7 +61,7 @@ export const NavBarPc = (props: { setIsSettingModalOpen: any }) => {
 
   return (
     <>
-      <header className="sticky top-0 left-0 right-0 z-50 hidden w-full h-16 font-medium bg-black rounded-b-lg lg:block">
+      <header className="sticky top-0 left-0 right-0 z-50 hidden w-full h-16 font-medium text-white bg-black rounded-b-lg lg:block">
         <div className="container flex items-center justify-between h-full px-2 mx-auto">
           <div className="flex items-center h-full gap-3">
             {NavbarItems.map((item) => {