diff --git a/src/App.js b/src/App.js
index 7c96152..0719bf2 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,10 +1,11 @@
 import React from 'react';
+import MyInfo from './componets/MyInfo';
 
 function App() {
   return (
-    <div>
-      <h1>Hello World!!</h1>
-    </div>
+    <>
+      <MyInfo/> 
+    </>
   );
 }
 
diff --git a/src/componets/MyInfo.css b/src/componets/MyInfo.css
new file mode 100644
index 0000000..eeceb4d
--- /dev/null
+++ b/src/componets/MyInfo.css
@@ -0,0 +1,12 @@
+h1 {
+  text-align: center;
+  font-style: italic;
+}
+
+.main {
+  text-align: center;
+}
+
+ul {
+  list-style: none;
+}
diff --git a/src/componets/MyInfo.js b/src/componets/MyInfo.js
new file mode 100644
index 0000000..f3e6cee
--- /dev/null
+++ b/src/componets/MyInfo.js
@@ -0,0 +1,17 @@
+import React from 'react'
+import "./MyInfo.css"
+
+export default function MyInfo() {
+    return (
+        <div className="main">
+            <h1>Ravyar Aram</h1>
+            <p>Hello there !!! My name is Ravyar and i'm 20 years old</p>
+            <ul>
+                <li>Las Vegas</li>
+                <li>Singapore</li>
+                <li>indonesia</li>
+                <li>France</li>
+            </ul>
+        </div>
+    )
+}