diff --git a/website/login.php b/website/login.php
index 8d6a319..d67c409 100644
--- a/website/login.php
+++ b/website/login.php
@@ -12,7 +12,7 @@
       <img style="width:50%;margin-left:25%" src="img/top-logo.png" alt="MyHyvesbook+">
     </div>
 
-    <form action="../profile.php/" method="post">
+    <form action="/profile.php" method="post">
       <h1>Welkom bij MyHyvesbook+ </h1>
       <div class="login_containerlogin">
         <label><b>Gebruikersnaam</b></label>
@@ -42,7 +42,7 @@
       class="close" title="Close Modal">&times;</span>
 
       <!-- Register Content -->
-        <form class="modal-content animate" action="../profile.php/" onsubmit="return passwordfunction()" method="post">
+        <form class="modal-content animate" action="/profile.php" onsubmit="return passwordfunction()" method="post">
           <h2>Registreer je account</h2>
 
           <div class="login_containerregister">
@@ -123,37 +123,127 @@
           </div>
         </form>
 
-      </div>
-    </div>
-    <script>
-    $("#default-settings").birthdayPicker();
-    </script>
-  </body>
+        <div class="login_containerlogin">
+            <button onclick="document.getElementById('id01').style.display='block'">Registreer</button>
+        </div>
+
+        <div class="login_containerregister">
+            <div id="id01" class="modal">
+                <span onclick="document.getElementById('id01').style.display='none'"
+                class="close" title="Close Modal">&times;</span>
+
+                <!-- Register Content -->
+                <form class="modal-content animate" action="../profile.php" onsubmit="return passwordfunction()" method="post">
+                    <h2>Registreer je account</h2>
+
+                    <div class="login_containerregister">
+                        <label><b>Naam</b></label>
+                        <input type="text" placeholder="Voer je naam in" name="name"
+                        pattern="[A-Za-z]{1,}" title="Moet alleen letters zijn" required>
+                    </div>
+
+                    <div class="login_containerregister">
+                        <label><b>Achternaam</b></label>
+                        <input type="text" placeholder="Voer je achternaam in" name="surname"
+                        pattern="[A-Za-z]{1,}" title="Moet alleen letters zijn" required>
+                    </div>
+
+                    <div class="login_containerregister">
+                        <label><b>Geboortedatum</b></label>
+                        <!-- These are the select elements we will target -->
+                    		<select id="dobday" title="Voer een dag in" ></select>
+                    		<select id="dobmonth" title="Voer een maand in" required></select>
+                    		<select id="dobyear" title="Voer een jaar in" required></select>
+                    		<!-- And here's the library being called! -->
+                    		<script>
+                    			$(document).ready(function() {
+                        				$.dobPicker({
+                          					daySelector: '#dobday',
+                          					monthSelector: '#dobmonth',
+                          					yearSelector: '#dobyear',
+                          					dayDefault: 'Dag',
+                          					monthDefault: 'Maand',
+                          					yearDefault: 'Jaar',
+                          					minimumAge: 12,
+                          					maximumAge: 80
+                        				});
+                      			});
+                    		</script>
+                    </div>
+
+                    <div class="login_containerregister">
+                        <label><b>Gebruikersnaam</b></label>
+                        <input type="text" placeholder="Voer je gebruikersnaam in" name="username"
+                        pattern=".{6,}" title="Moet meer dan 6 karakers zijn" required>
+                    </div>
+
+                    <div class="login_containerregister">
+                        <label><b>Wachtwoord</b></label>
+                        <input type="password" placeholder="Voer je wachtwoord in" name="password"
+                        pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" id="password"
+                        title="Moet miniaal 1 cijfer, 1 hoofdletter en kleine letter hebben en minstens 8 of meer karakters zijn" required>
+                    </div>
+
+                    <div class="login_containerregister">
+                        <label><b>Herhaal wachtwoord</b></label>
+                        <input type="password" placeholder="Herhaal wachtwoord" name="confirmpassword"
+                        pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" id="confirmpassword"
+                        title="Herhaal wachtwoord" required>
+                    </div>
+
+                    <div class="login_containerregister">
+                        <label><b>Straatnaam</b></label>
+                        <input type="text" placeholder="Voer jouw straatnaam in" name="name"
+                        pattern="[A-Za-z]{1,}" title="Moet alleen letters zijn" required>
+                    </div>
+
+                    <div class="login_containerregister">
+                        <label><b>Straatnummer</b></label>
+                        <input type="text" placeholder="Voer jouw straatnummer in" name="name"
+                        pattern="[1-9][0-9]{0,}" title="Moet alleen nummers zijn" required>
+                    </div>
+
+                    <div class="login_containerregister">
+                        <label><b>Email</b></label>
+                        <input type="email" placeholder="Voer je email in" id="email"
+                        title="Voer een geldige email in" required>
+                    </div>
+
+                    <div class="login_containerregister">
+                        <input type="submit" value="Registreer je account" name="Submit" id="frm1_submit" />
+                    </div>
+                </form>
+            </div>
+        </div>
+        <script>
+        $("#default-settings").birthdayPicker();
+        </script>
+    </body>
 </html>
 
 <script>
-// Get the modal
-var modal = document.getElementById('id01');
-// When the user clicks anywhere outside of the modal, close it
-window.onclick = function(event) {
-   if (event.target == modal) {
-       modal.style.display = "none";
-   }
+    // Get the modal
+    var modal = document.getElementById('id01');
+    // When the user clicks anywhere outside of the modal, close it
+    window.onclick = function(event) {
+        if (event.target == modal) {
+            modal.style.display = "none";
+        }
 }
 </script>
 
 <script>
-function passwordfunction() {
-    var password1 = document.getElementById("password").value;
-    var password2 = document.getElementById("confirmpassword").value;
-    var passwordmatching = true;
+    function passwordfunction() {
+        var password1 = document.getElementById("password").value;
+        var password2 = document.getElementById("confirmpassword").value;
+        var passwordmatching = true;
 
-    if (password1 != password2) {
-        document.getElementById("password").style.borderColor = "red";
-        document.getElementById("confirmpassword").style.borderColor = "red";
-        passwordmatching = false;
-        confirmpassword.setCustomValidity("Wachwoord match niet")
+        if (password1 != password2) {
+            document.getElementById("password").style.borderColor = "red";
+            document.getElementById("confirmpassword").style.borderColor = "red";
+            passwordmatching = false;
+            confirmpassword.setCustomValidity("Wachwoord match niet")
+        }
+        return passwordmatching;
     }
-    return passwordmatching;
-}
-</script>
+</script>
\ No newline at end of file
diff --git a/website/settings.php b/website/settings.php
new file mode 100644
index 0000000..8d154b1
--- /dev/null
+++ b/website/settings.php
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<?php include("views/head.php"); ?>
+    <body>
+        <?php
+        /*
+         * This view adds the main layout over the screen.
+         * Header and menu.
+         */
+        include("views/main.php");
+
+        /* Add your view files here. */
+        include("views/settings-view.php");
+
+        /* This adds the footer. */
+        include("views/footer.php");
+        ?>
+    </body>
+</html>
diff --git a/website/styles/settings.css b/website/styles/settings.css
new file mode 100644
index 0000000..933f8b0
--- /dev/null
+++ b/website/styles/settings.css
@@ -0,0 +1,33 @@
+.settings {
+
+}
+
+.settings input,
+.settings textarea{
+    padding: 10px;
+    margin: 5px;
+    border-radius: 10px;
+    width: 200px;
+}
+
+.settings label {
+    width: 125px;
+    display: inline-block;
+    text-align: right;
+}
+
+.settings input[type="password"],
+.settings input[type="text"],
+.settings input[type="date"],
+.settings input[type="email"],
+.settings textarea{
+    border: 1px solid black;
+}
+
+.settings-password {
+
+}
+
+.settings-profile {
+
+}
\ No newline at end of file
diff --git a/website/views/head.php b/website/views/head.php
index 81149ee..0d51d03 100644
--- a/website/views/head.php
+++ b/website/views/head.php
@@ -16,5 +16,6 @@
         @import url("styles/search.css");
         @import url("styles/adminpanel.css");
         @import url("styles/chat.css");
+        @import url("styles/settings.css");
     </style>
 </head>
diff --git a/website/views/header.php b/website/views/header.php
index 7c7b431..ac8ae19 100644
--- a/website/views/header.php
+++ b/website/views/header.php
@@ -10,8 +10,8 @@
     </div>
     <div class="right profile-menu">
         <div id="profile-menu-popup">
-            <a href="login.php"><span style="color: red;" class="fa fa-sign-out" data-title="Uitloggen"></span></a> |
-            <a href="setting.php"><span style="color: blue;" class="fa fa-cog" data-title="Instellingen"></span></a> |
+            <a href="index.php"><span style="color: red;" class="fa fa-sign-out" data-title="Uitloggen"></span></a> |
+            <a href="settings.php"><span style="color: blue;" class="fa fa-cog" data-title="Instellingen"></span></a> |
             <a href="profile.php"><span style="color: green;" class="fa fa-user" data-title="Profiel"></span></a>
         </div>
         <div id="profile-hello-popup">
diff --git a/website/views/settings-view.php b/website/views/settings-view.php
new file mode 100644
index 0000000..12415b4
--- /dev/null
+++ b/website/views/settings-view.php
@@ -0,0 +1,87 @@
+<div class="content">
+    <div class="settings">
+        <form class="settings-profile platform">
+            <h5>Profiel Instllingen</h5>
+            <label for="first-name">Voornaam</label>
+            <input type="text"
+                   name="first-name"
+                   id="first-name"
+                   placeholder="Voornaam"
+                   title="Voornaam"
+            ><br />
+            <label for="last-name">Achternaam</label>
+            <input type="text"
+                   name="last-name"
+                   id="last-name"
+                   placeholder="Lastname"
+            ><br />
+            <label for="place">Woonplaats</label>
+            <input type="text"
+                   name="place"
+                   id="place"
+                   placeholder="Woonplaats"
+            ><br />
+            <label for="bday">Geboortedatum</label>
+            <input type="date"
+                   name="bday"
+                   id="bday"
+                   placeholder="01/01/1900"
+            ><br />
+            <label for="location">Locatie</label>
+            <input type="text"
+                   name="location"
+                   id="location"
+                   placeholder="Locatie"
+            ><br />
+            <label for="bio">Bio</label>
+            <textarea name="bio"
+                      rows="5"
+                      cols="10"
+                      title="bio"
+                      id="bio"
+            ></textarea>
+            <br />
+
+            <label></label>
+            <input type="submit"
+            >
+        </form>
+
+
+        <form class="settings-password platform" method="post">
+            <h5>Verander Wachtwoord</h5>
+            <br />
+            <input type="password"
+                   name="password-old"
+                   placeholder="Oud wachtwoord"
+            ><br />
+            <input type="password"
+                   name="password-new"
+                   placeholder="Nieuw wachtwoord"
+            ><br />
+            <input type="password"
+                   name="password-confirm"
+                   placeholder="Bevestig wachtwoord"
+            ><br />
+            <input type="submit"
+                   value="Verander wachtwoord"
+            >
+        </form>
+
+        <form class="settings-email platform" method="post">
+            <h5>Verander Email</h5>
+            <br />
+            <input type="email"
+                   name="email"
+                   placeholder="Nieuw Email-adres"
+            ><br />
+            <input type="email"
+                   name="email-confirm"
+                   placeholder="Bevestig Email"
+            ><br />
+            <input type="submit"
+                   value="Verander Email"
+            >
+        </form>
+    </div>
+</div>
\ No newline at end of file