diff --git a/bob_party/src/components/ScreenIndicator.tsx b/bob_party/src/components/ScreenIndicator.tsx
new file mode 100644
index 0000000..8acaf9d
--- /dev/null
+++ b/bob_party/src/components/ScreenIndicator.tsx
@@ -0,0 +1,13 @@
+import { FC, ReactNode } from "react"
+import { Pressable, Image, ImageStyle, Text, View, Alert, ImageSourcePropType, TextStyle } from "react-native"
+import React from "react"
+import styles from './style/ScreenIndicator.style'
+
+export const ScreenIndicator: FC<{title: String}> = ({title}) => 
+{
+    return(
+        <View style={styles.textTopView}>
+            <Text style={styles.textTop}>{title}</Text>
+        </View>
+    )
+}
\ No newline at end of file
diff --git a/bob_party/src/components/style/ScreenIndicator.style.js b/bob_party/src/components/style/ScreenIndicator.style.js
new file mode 100644
index 0000000..3616932
--- /dev/null
+++ b/bob_party/src/components/style/ScreenIndicator.style.js
@@ -0,0 +1,21 @@
+import { StyleSheet } from 'react-native';
+
+export default StyleSheet.create({
+    textTop: {
+        textAlign: "center",
+        fontSize: 16,
+        lineHeight: 21,
+        fontWeight: 'bold',
+        letterSpacing: 0.25,
+        color: 'white',
+    },
+    textTopView: {
+        backgroundColor: '#0085FF',
+        width: '30%',
+        padding: 5,
+        paddingBottom: 10,
+        alignSelf: 'center',
+        borderBottomRightRadius: 50,
+        borderBottomLeftRadius: 50,
+    }
+});
\ No newline at end of file