diff --git a/client/app/components/chat/NearbyCount.tsx b/client/app/components/chat/NearbyCount.tsx
deleted file mode 100644
index 0b62b9ba5..000000000
--- a/client/app/components/chat/NearbyCount.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import React from "react";
-import { View, Image, StyleSheet, Text, Dimensions } from "react-native";
-
-import { CounterProps } from "../../types/Props";
-
-const NearbyCount: React.FC<CounterProps> = ({ count }) => {
-  return (
-    <View style={styles.iconContainer}>
-      <View style={styles.iconAndCount}>
-        <Image
-          style={styles.iconImage}
-          source={require("../../../assets/icons/misc/nearby_icon.png")}
-        />
-        <Text style={styles.countText}>{count}</Text>
-      </View>
-    </View>
-  );
-};
-
-const styles = StyleSheet.create({
-  iconImage: {
-    tintColor: "white",
-    height: Dimensions.get("window").height * 0.025,
-    width: Dimensions.get("window").height * 0.03,
-  },
-  iconContainer: {
-    width: "50%",
-    marginRight: 35,
-    marginTop: 18,
-  },
-  iconAndCount: {
-    alignSelf: "flex-end",
-    alignItems: "center",
-  },
-  countText: {
-    fontFamily: "Quicksand",
-    fontSize: 13,
-    fontWeight: "bold",
-    color: "white",
-    textAlign: "center",
-    width: "50%",
-  },
-});
-
-export default NearbyCount;
diff --git a/client/app/components/chat/NearbyHeader.tsx b/client/app/components/chat/NearbyHeader.tsx
index 00dc6aea9..93086af07 100644
--- a/client/app/components/chat/NearbyHeader.tsx
+++ b/client/app/components/chat/NearbyHeader.tsx
@@ -1,19 +1,25 @@
 import React from "react";
-import { View, Text, StyleSheet, Dimensions, Image } from "react-native";
+import {
+  View,
+  Text,
+  StyleSheet,
+  Dimensions,
+  Image,
+  TouchableOpacity,
+} from "react-native";
+import { ChevronLeft } from "react-native-feather";
 
-import NearbyCount from "./NearbyCount";
-import { CounterProps } from "../../types/Props";
-
-export const NearbyHeader: React.FC<CounterProps> = ({ count }) => {
+export const NearbyHeader: React.FC = () => {
   return (
     <View style={styles.nearbyContainer}>
-      <View style={{ flexDirection: "row" }}>
+      <ChevronLeft color="white" strokeWidth={1.4} width={40} height={40} />
+      <Text style={styles.nearbyText}>Nearby</Text>
+      <View style={styles.iconContainer}>
         <Image
-          source={require("../../../assets/icons/arrow/angle-right.png")}
-          style={styles.backArrow}
+          style={styles.peopleIcon}
+          source={require("../../../assets/icons/misc/nearby_icon.png")}
         />
-        <Text style={styles.nearbyText}>Nearby</Text>
-        <NearbyCount count={count} />
+        <Text style={styles.countText}>{5}</Text>
       </View>
     </View>
   );
@@ -21,34 +27,42 @@ export const NearbyHeader: React.FC<CounterProps> = ({ count }) => {
 
 const styles = StyleSheet.create({
   nearbyContainer: {
+    display: "flex",
+    flexDirection: "row",
     backgroundColor: "#34D1BF",
     width: "100%",
     alignItems: "center",
-    justifyContent: "space-between",
+    justifyContent: "flex-start",
     shadowColor: "black",
-    shadowOffset: {width: 0, height: 2},
+    shadowOffset: { width: 0, height: 2 },
     shadowOpacity: 0.3,
     shadowRadius: 2,
+    paddingVertical: 15,
+    paddingRight: 25,
+    paddingLeft: 10,
+    gap: 10,
   },
   nearbyText: {
     fontFamily: "Quicksand",
     fontSize: 24,
     fontWeight: "bold",
     color: "white",
-    textAlign: "center",
-    height: 70,
-    marginLeft: 110,
     marginRight: "auto",
-    top: 18,
   },
-  backArrow: {
-    transform: "scale(-1)",
-    height: 27,
-    width: 10,
+  peopleIcon: {
     tintColor: "white",
-    position: "absolute",
-    marginLeft: 33,
-    top: 22,
+    height: Dimensions.get("window").height * 0.025,
+    width: Dimensions.get("window").height * 0.03,
+  },
+  iconContainer: {
+    display: "flex",
+    alignItems: "center",
+  },
+  countText: {
+    fontFamily: "Quicksand",
+    fontSize: 13,
+    fontWeight: "bold",
+    color: "white",
   },
 });
 
diff --git a/client/app/types/Props.ts b/client/app/types/Props.ts
index 511236481..fad90179c 100644
--- a/client/app/types/Props.ts
+++ b/client/app/types/Props.ts
@@ -32,11 +32,6 @@ export type MessageChannelProps = {
   messages: Message[];
 };
 
-/* misc props*/
-export type CounterProps = {
-  count: number;
-};
-
 export type SafeAreaWrapperProps = {
   children: React.ReactNode;
 };