diff --git a/index.html b/index.html
new file mode 100644
index 0000000..851ac4c
--- /dev/null
+++ b/index.html
@@ -0,0 +1,107 @@
+<!DOCTYPE html>
+<html>
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+<link href="https://fonts.googleapis.com/css?family=Pacifico" rel="stylesheet">
+<style>
+div{
+    width: auto;
+    border: 5px solid grey;
+    padding: 25px;
+    margin: 140px;
+    align-items: centre;
+    border-radius: 10%;
+    border-style: dotted;
+
+}
+
+body {
+  background-image: url(https://images.unsplash.com/photo-1491183672482-d0af0e44929d?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=e041b3a3488b7dd2d028c7350c7c6ee1&auto=format&fit=crop&w=2250&q=80);
+  font-family: 'pacifico',cursive ;
+  font-size: 24px;
+  color: rgb(128,128,128);
+}
+
+.center {
+  align-content:center;
+  margin-left: 500px;
+  margin-right: auto;
+  margin-top: auto;
+    width: 50%;
+    padding: 50px;
+    border: 1px;
+
+}
+
+.fa {
+    padding: 7px;
+    font-size: 40px;
+    width: 40px;
+    text-align: center;
+    text-decoration: none;
+    border-radius: 50%;
+}
+.fa-twitter {
+    background: #55ACEE;
+    color: white;
+}
+
+.fa:hover {
+    opacity: 0.7;
+}
+.fa-linkedin {
+  background: #007bb5;
+  color: white;
+}
+
+.border{
+  border-color: silver;
+  border-width: 10px;
+  border-style: groove;
+  border-radius: 50%;
+}
+
+.smaller-image {
+  width: auto;
+}
+.textstyle {
+  font-family: 'pacifico' serif ;
+  font-size: 48px,
+
+}
+
+.text-centre{
+  text-align: center;
+  margin-left: 300px;
+  margin-right: 300px;
+  margin-top: auto;
+  margin-bottom: auto;
+}
+
+}
+#contactbackground{
+  background-color: blue;
+}
+</style>
+<head>
+  <title>Ethan's homepage</title>
+</head>
+
+<body >
+
+  <div class="center">
+      <img  class = "border smaller-image" src ="https://lh3.googleusercontent.com/-ElOBNqFrvms/VAtaXHVGXEI/AAAAAAAAAE0/FH7dxpYX7T8myEBEmf2HSYA6JjxAbKGsQCEwYBhgL/w278-h280-p/c24dbf37-c1f9-4a18-8daf-bcb9380ace51" alt="photo of myself">
+  </div>
+  <div id="biobackground" class="text-centre textstyle">
+      <h1>Hi my name is Ethan, thank you for visitng this page </h1>
+      <h2> more about me:</h2>
+      <h3> I am a beginner in web design and working towards becoming a software engineer in the near future.
+        I am always happy to learn new skills to make things work better. Born in Hong Kong and currently based in London,
+        worked in various roles in the NHS for the last 10 years. Keen cyclist, cycle everywhere in London.</h3>
+      </div>
+<div>
+      <h4>see what I read/tweet about:@ethanng329 <a href="https://twitter.com/Ethanng329" class="fa fa-twitter"></a></h4>
+      <h4>see what I have studied and my work in the past: <a href="https://www.linkedin.com/in/ethan-ng-654b94164/" class="fa fa-linkedin"></a></h4>
+</div>
+
+</body>
+</html>
