diff --git a/app/src/main/java/com/aiosman/riderpro/NewPost.kt b/app/src/main/java/com/aiosman/riderpro/NewPost.kt
new file mode 100644
index 0000000..8b3841f
--- /dev/null
+++ b/app/src/main/java/com/aiosman/riderpro/NewPost.kt
@@ -0,0 +1,204 @@
+package com.aiosman.riderpro
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.ExperimentalLayoutApi
+import androidx.compose.foundation.layout.FlowRow
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.heightIn
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.text.BasicTextField
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.drawBehind
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.PathEffect
+import androidx.compose.ui.graphics.drawscope.Stroke
+import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+
+@Preview
+@Composable
+fun NewPostScreen() {
+    Column(
+        modifier = Modifier
+            .fillMaxSize()
+            .background(Color.White)
+    ) {
+
+        NewPostTopBar()
+        NewPostTextField("What's on your mind?")
+        AddImageGrid()
+        AdditionalPostItem()
+    }
+}
+
+@Composable
+fun NewPostTopBar() {
+    Box(
+        modifier = Modifier
+            .fillMaxWidth()
+            .padding(horizontal = 18.dp, vertical = 10.dp)
+
+    ) {
+        Row(
+            modifier = Modifier.align(Alignment.CenterStart),
+        ) {
+            Image(
+                painter = painterResource(id = R.drawable.rider_pro_close),
+                contentDescription = "Back",
+                modifier = Modifier.size(24.dp)
+            )
+            Spacer(modifier = Modifier.weight(1f))
+            Image(
+                painter = painterResource(id = R.drawable.rider_pro_send_post),
+                contentDescription = "Send",
+                modifier = Modifier.size(24.dp)
+            )
+        }
+    }
+
+}
+
+@Composable
+fun NewPostTextField(hint: String) {
+    var text by remember { mutableStateOf("") }
+
+    Box(modifier = Modifier.fillMaxWidth()) {
+        BasicTextField(
+            value = text,
+            onValueChange = { text = it },
+            modifier = Modifier
+                .fillMaxWidth()
+                .heightIn(200.dp)
+                .padding(horizontal = 18.dp, vertical = 10.dp)
+
+        )
+        if (text.isEmpty()) {
+            Text(
+                text = hint,
+                color = Color.Gray,
+                modifier = Modifier.padding(horizontal = 18.dp, vertical = 10.dp)
+            )
+        }
+    }
+}
+
+@OptIn(ExperimentalLayoutApi::class)
+@Composable
+fun AddImageGrid() {
+    val stroke = Stroke(
+        width = 2f,
+        pathEffect = PathEffect.dashPathEffect(floatArrayOf(10f, 10f), 0f)
+    )
+    Box(
+        modifier = Modifier.fillMaxWidth()
+    ) {
+        FlowRow(
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(18.dp),
+            verticalArrangement = Arrangement.spacedBy(8.dp),
+            horizontalArrangement = Arrangement.spacedBy(8.dp)
+        ) {
+            repeat(5) {
+                Image(
+                    painter = painterResource(id = R.drawable.rider_pro_moment_demo_1),
+                    contentDescription = "Add Image",
+                    modifier = Modifier.size(110.dp),
+                    contentScale = ContentScale.Crop
+                )
+            }
+            Box(
+                modifier = Modifier
+                    .size(110.dp)
+                    .background(Color(0xFFFFFFFF))
+                    .drawBehind {
+                        drawRoundRect(color = Color(0xFF999999), style = stroke)
+                    },
+            ) {
+                Image(
+                    painter = painterResource(id = R.drawable.rider_pro_new_post_add_pic),
+                    contentDescription = "Add Image",
+                    modifier = Modifier
+                        .size(48.dp)
+                        .align(Alignment.Center)
+                )
+            }
+
+        }
+    }
+
+}
+
+@Composable
+fun AdditionalPostItem() {
+    Column(
+        modifier = Modifier.fillMaxWidth()
+    ) {
+        Box(
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(vertical = 16.dp, horizontal = 24.dp)
+        ) {
+            Row(
+                verticalAlignment = Alignment.CenterVertically
+            ) {
+                Image(
+                    painter = painterResource(id = R.drawable.rider_pro_add_location),
+                    contentDescription = "Location",
+                    modifier = Modifier.size(24.dp)
+                )
+                Spacer(modifier = Modifier.width(12.dp))
+                Text("Add Location", color = Color(0xFF333333))
+                Spacer(modifier = Modifier.weight(1f))
+                Image(
+                    painter = painterResource(id = R.drawable.rider_pro_nav_next),
+                    contentDescription = "Add Location",
+                    modifier = Modifier.size(24.dp)
+                )
+            }
+
+        }
+        Box(
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(vertical = 16.dp, horizontal = 24.dp)
+        ) {
+            Row(
+                verticalAlignment = Alignment.CenterVertically
+            ) {
+                Image(
+                    painter = painterResource(id = R.drawable.rider_pro_modification),
+                    contentDescription = "Modification List",
+                    modifier = Modifier.size(24.dp)
+                )
+                Spacer(modifier = Modifier.width(12.dp))
+                Text("Modification List", color = Color(0xFF333333))
+                Spacer(modifier = Modifier.weight(1f))
+                Image(
+                    painter = painterResource(id = R.drawable.rider_pro_nav_next),
+                    contentDescription = "Modification List",
+                    modifier = Modifier.size(24.dp)
+                )
+            }
+
+        }
+    }
+}
\ No newline at end of file
diff --git a/app/src/main/res/drawable/rider_pro_add_location.xml b/app/src/main/res/drawable/rider_pro_add_location.xml
new file mode 100644
index 0000000..a281eb4
--- /dev/null
+++ b/app/src/main/res/drawable/rider_pro_add_location.xml
@@ -0,0 +1,7 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:alpha="0.77" android:height="24dp" android:viewportHeight="24" android:viewportWidth="24" android:width="24dp">
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M19,10.364C19,16.091 12,21 12,21C12,21 5,16.091 5,10.364C5,6.297 8.134,3 12,3C15.866,3 19,6.297 19,10.364L19,10.364Z" android:strokeColor="#000000" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.63636365"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M12,10m-2,0a2,2 0,1 1,4 0a2,2 0,1 1,-4 0" android:strokeColor="#000000" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.63636365"/>
+    
+</vector>
diff --git a/app/src/main/res/drawable/rider_pro_close.xml b/app/src/main/res/drawable/rider_pro_close.xml
new file mode 100644
index 0000000..7ed4f20
--- /dev/null
+++ b/app/src/main/res/drawable/rider_pro_close.xml
@@ -0,0 +1,12 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M9.5,6L12.5,10L15.5,6L19,6L14.5,12L19,18L15.5,18L12.5,14L9.5,18L6,18L10.5,12L6,6L9.5,6Z"
+      android:strokeWidth="1"
+      android:fillColor="#000000"
+      android:fillType="evenOdd"
+      android:strokeColor="#00000000"/>
+</vector>
diff --git a/app/src/main/res/drawable/rider_pro_modification.xml b/app/src/main/res/drawable/rider_pro_modification.xml
new file mode 100644
index 0000000..d5f2cef
--- /dev/null
+++ b/app/src/main/res/drawable/rider_pro_modification.xml
@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:alpha="0.77" android:height="24dp" android:viewportHeight="24" android:viewportWidth="24" android:width="24dp">
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M18.57,7.253C19.466,9.346 18.932,11.776 17.242,13.301C15.552,14.825 13.08,15.106 11.091,14L11.091,14L6.418,19.414C5.636,20.195 4.368,20.195 3.586,19.414C2.805,18.632 2.805,17.364 3.586,16.582L9,11.909L9,11.909C7.894,9.92 8.175,7.448 9.699,5.758C11.224,4.068 13.654,3.534 15.747,4.43L12.248,7.92L12.723,10.277L15.08,10.752L18.57,7.253Z" android:strokeColor="#000000" android:strokeLineCap="round" android:strokeLineJoin="round" android:strokeWidth="1.5"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M15,17.5L21,17.5" android:strokeColor="#000000" android:strokeWidth="1.5"/>
+      
+    <path android:fillColor="#00000000" android:fillType="evenOdd" android:pathData="M13,20.5L21,20.5" android:strokeColor="#000000" android:strokeWidth="1.5"/>
+    
+</vector>
diff --git a/app/src/main/res/drawable/rider_pro_new_post_add_pic.xml b/app/src/main/res/drawable/rider_pro_new_post_add_pic.xml
new file mode 100644
index 0000000..b0825ec
--- /dev/null
+++ b/app/src/main/res/drawable/rider_pro_new_post_add_pic.xml
@@ -0,0 +1,5 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:alpha="0.77" android:height="24dp" android:tint="#D8D8D8" android:viewportHeight="24" android:viewportWidth="24" android:width="24dp">
+      
+    <path android:fillColor="@android:color/white" android:pathData="M19,13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/>
+    
+</vector>
diff --git a/app/src/main/res/drawable/rider_pro_send_post.xml b/app/src/main/res/drawable/rider_pro_send_post.xml
new file mode 100644
index 0000000..d804dc0
--- /dev/null
+++ b/app/src/main/res/drawable/rider_pro_send_post.xml
@@ -0,0 +1,22 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M21,3L11.1,12.9"
+      android:strokeLineJoin="round"
+      android:strokeWidth="1.8"
+      android:fillColor="#00000000"
+      android:strokeColor="#000000"
+      android:fillType="evenOdd"
+      android:strokeLineCap="round"/>
+  <path
+      android:pathData="M21,3l-6.3,18l-3.6,-8.1l-8.1,-3.6z"
+      android:strokeLineJoin="round"
+      android:strokeWidth="1.8"
+      android:fillColor="#00000000"
+      android:strokeColor="#000000"
+      android:fillType="evenOdd"
+      android:strokeLineCap="round"/>
+</vector>