diff --git a/app/src/components/NavBar/HomeNavBar.tsx b/app/src/components/NavBar/HomeNavBar.tsx
index 6513b19e8..01238e49b 100644
--- a/app/src/components/NavBar/HomeNavBar.tsx
+++ b/app/src/components/NavBar/HomeNavBar.tsx
@@ -72,7 +72,7 @@ export const HomeNavBar = (props: NativeStackHeaderProps) => {
   return (
     <NavBar.Container
       backgroundColor={slate50}
-      barStyle={'light'}
+      barStyle={'dark'}
       padding={8}
       justifyContent="space-between"
       paddingTop={Math.max(insets.top, 15) + extraYPadding}
diff --git a/app/src/components/NavBar/IdDetailsNavBar.tsx b/app/src/components/NavBar/IdDetailsNavBar.tsx
index 8bc02e082..4b7d2b961 100644
--- a/app/src/components/NavBar/IdDetailsNavBar.tsx
+++ b/app/src/components/NavBar/IdDetailsNavBar.tsx
@@ -19,7 +19,7 @@ export const IdDetailsNavBar = (props: NativeStackHeaderProps) => {
   return (
     <NavBar.Container
       backgroundColor={slate50}
-      barStyle={'light'}
+      barStyle={'dark'}
       justifyContent="space-between"
       paddingTop={Math.max(insets.top, 15) + extraYPadding}
     >