diff --git a/index.html b/index.html
new file mode 100644
index 0000000..e80c0dd
--- /dev/null
+++ b/index.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="fr">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>My Website</title>
+    <link rel="stylesheet" href="./style.css">
+    <link rel="icon" href="./favicon.ico" type="image/x-icon">
+  </head>
+  <body>
+    <div class="test" id="welcome_div">
+        <div class="test" id="name_div">
+            <div id="profile_picture"><img src="https://picsum.photos/200" height="100%" width="100%"></div>
+            <p id="random_citation">Random Sentence</p>
+            <div class="test" id="welcome_text_div">
+                <h1>Hello ! I'm </h1>
+                <h2>AI enthousiast</h2>
+            </div>
+        </div>
+    </div>
+  </body>
+</html>
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..721d5b2
--- /dev/null
+++ b/style.css
@@ -0,0 +1,54 @@
+html, body{
+    background-color: #1E1E1E;
+    margin: 0;
+    overflow-x: hidden;
+}
+
+h1,h2,h3,h4,h5,p{
+    color: #EAEAEA;
+    /*Family Roboto or Atma ?*/
+}
+
+.test{
+    border: red dotted 2px;
+}
+
+#welcome_div{
+    width: 100vw;
+    min-height: 100vh;
+    margin: 0;
+}
+
+#random_citation{
+    position: absolute;
+    top: 180px;
+    left: 65%;
+    font-size: 2em;
+    transform:rotate(15deg);
+}
+
+#name_div{
+    margin-top: 10%;
+    margin-left: 15%;
+    height: fit-content;
+    width: fit-content;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+}
+
+#profile_picture{
+    width: 300px;
+    height: 300px;
+}
+#profile_picture img{
+    border-radius: 50%;
+}
+
+#welcome_text_div{
+    height: 100%;
+    width: fit-content;
+}
+#welcome_text_div h1{
+    margin-top: 100px;
+}
\ No newline at end of file
