diff --git a/.gitignore b/.gitignore
index 67c112e..1860e8c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
 config.json
 public/images
+public/assets
 node_modules
\ No newline at end of file
diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css
index 89926a3..8ffd271 100644
--- a/public/stylesheets/style.css
+++ b/public/stylesheets/style.css
@@ -1,4 +1,6 @@
-
+body {
+    word-wrap: break-word;
+}
 
 #ACode {
     width:225px;
@@ -8,14 +10,6 @@
     margin-top: -1%;
 }
 
-img {
-    display: block;
-    margin-left: auto;
-    margin-right: auto;
-    max-width: 100%; 
-    height: auto;
-}
-
 #loginContent {
     display: block;
     margin-left: auto;
@@ -24,7 +18,8 @@ img {
 }
 
 h1 {
-    font-size: 3em;
+    font-size: 2em;
+    text-transform: full-width-to-half-width;
 }
 h5 {
     font-size: 1.3em;
@@ -32,3 +27,11 @@ h5 {
 h4 {
     font-size: 1.5em;
 }
+
+#imgHeader {
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+    max-width: 100%; 
+    height: auto;
+}
\ No newline at end of file
diff --git a/public/stylesheets/user.css b/public/stylesheets/user.css
new file mode 100644
index 0000000..3f42121
--- /dev/null
+++ b/public/stylesheets/user.css
@@ -0,0 +1,14 @@
+#user-image {
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+    max-width: 8em; 
+    height: auto;
+}
+
+#User {
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+    margin: 1%;
+}
\ No newline at end of file
diff --git a/readme.md b/readme.md
index ccd1cd1..e926a88 100644
--- a/readme.md
+++ b/readme.md
@@ -8,6 +8,19 @@ Currently, I only have access to AQUA, but ARTEMiS could be supported once AQUA
 
 # How to use:
 
+## All Servers
+
+You'll need to extract the assets from the game itself.
+
+in the public folder, the assets should look like this
+
+-- Public
+| - Assets
+\___ | - icon (icons should go here)
+     | - more soon 
+
+Then, create the `/public/image/` folder. this will be where the images will be stored.
+
 ## Aqua
 
 Create a `config.json` file and paste this in, with paths to your instance.
@@ -19,15 +32,16 @@ Create a `config.json` file and paste this in, with paths to your instance.
 }
 ```
 
-Then, create the `/public/image/` folder. this will be where the images will be stored.
-
 # Project Progress
 
 ToDo:
-- Make User Profile on User Page
-    - (Done) Get User Data, and send it.
-    - Grab the User Profile, and get the custom one if the user icon ID is set to 10.
+- Make User Profile on User Page (almost done)
+    - fuck you go work on divs and grids and spacing and go watch Hyperplexed you no name piece of shit - literally me talking to me
+
 - Literally everything else
 
 Complete:
-- Sign In Page
\ No newline at end of file
+- Sign In Page
+- Make User Profile on User Page (almost done)
+    - (Done) Get User Data, and send it.
+    - (Done) Grab the User Profile, and get the custom one if the user icon ID is set to 10. 
\ No newline at end of file
diff --git a/templates/header.ejs b/templates/header.ejs
index 741480e..46a650d 100644
--- a/templates/header.ejs
+++ b/templates/header.ejs
@@ -11,4 +11,7 @@
         <meta name="msapplication-TileColor" content="#da532c">
         <meta name="theme-color" content="#ffffff">
     </head>
-    <body>
\ No newline at end of file
+    <body>
+        <div id="imgHeader">
+            <img id="imgHeader" src="MaiMaiDXNet/maimaidxex.jpg">
+        </div>
\ No newline at end of file
diff --git a/views/index.ejs b/views/index.ejs
index a02baff..a663eee 100644
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -1,8 +1,6 @@
 <% var rootPath='../' ; %>
     <%- include(rootPath + 'templates/header.ejs' ); %>
-        <div id="wrapper">
-            <img src="MaiMaiDXNet/maimaidxex.jpg">
-        </div>
+        
         <div id="loginContent">
             <h1>MaiMaiDX.Net</h1>
             <h5>Total Users Registered: <%= params.totalUsers %>
diff --git a/views/user.ejs b/views/user.ejs
index 5f009de..68ec176 100644
--- a/views/user.ejs
+++ b/views/user.ejs
@@ -1,65 +1,102 @@
 <% var rootPath='../' ; %>
     <%- include(rootPath + 'templates/header.ejs' ); %>
-        <h1>Yo! Welcome Back ${User}!</h1>
-        <button id="clear-storage-btn">Sign Out</button>
+        <% function normalizeText(text) { return text .normalize('NFD') .replace(/[\u0300-\u036f]/g, '' )
+            .replace(/[\uFF01-\uFF5E]/g, function(ch) { return String.fromCharCode(ch.charCodeAt(0) - 0xFEE0); }); } %>
+            <link href="/stylesheets/user.css" rel="stylesheet" type="text/css">
+            <div id="User">
+                <h1>Yo! Welcome Back <%= normalizeText(userdata.user_name) %>!</h1>
+                <button id="clear-storage-btn">Sign Out</button>
 
-        <script>
-            const extId = localStorage.getItem('ext_id');
-            const luid = localStorage.getItem('luid');
-            const clearStorageBtn = document.getElementById('clear-storage-btn');
-            clearStorageBtn.addEventListener('click', () => {
-                // Remove the cookies
-                function removeCookies() {
-                    // Set the expiration date to a date in the past
-                    const expirationDate = new Date(0).toUTCString();
+                <script>
+                    const extId = localStorage.getItem('ext_id');
+                    const luid = localStorage.getItem('luid');
+                    const clearStorageBtn = document.getElementById('clear-storage-btn');
+                    clearStorageBtn.addEventListener('click', () => {
+                        // Remove the cookies
+                        function removeCookies() {
+                            // Set the expiration date to a date in the past
+                            const expirationDate = new Date(0).toUTCString();
 
-                    // Set the ext_id cookie to expire
-                    document.cookie = `ext_id=; expires=${expirationDate}`;
+                            // Set the ext_id cookie to expire
+                            document.cookie = `ext_id=; expires=${expirationDate}`;
 
-                    // Set the luid cookie to expire
-                    document.cookie = `luid=; expires=${expirationDate}`;
+                            // Set the luid cookie to expire
+                            document.cookie = `luid=; expires=${expirationDate}`;
 
-                    // Set the aime_card_id cookie to expire
-                    document.cookie = `aime_card_id=; expires=${expirationDate}`;
-                }
+                            // Set the aime_card_id cookie to expire
+                            document.cookie = `aime_card_id=; expires=${expirationDate}`;
+                        }
 
-                // Example usage
-                removeCookies();
+                        // Example usage
+                        removeCookies();
 
-                console.log('Local storage cleared.');
-                window.location = "/";
-            });
+                        console.log('Local storage cleared.');
+                        window.location = "/";
+                    });
 
-            // Get the cookie string
-            const cookieString = document.cookie;
+                    // Get the cookie string
+                    const cookieString = document.cookie;
 
-            // Parse the cookie string and extract the values
-            const cookies = cookieString.split(';');
-            let ext_id2, luid2;
+                    // Parse the cookie string and extract the values
+                    const cookies = cookieString.split(';');
+                    let ext_id2, luid2;
 
-            for (let i = 0; i < cookies.length; i++) {
-                const cookie = cookies[i].trim();
-                const cookieParts = cookie.split('=');
+                    for (let i = 0; i < cookies.length; i++) {
+                        const cookie = cookies[i].trim();
+                        const cookieParts = cookie.split('=');
 
-                if (cookieParts[0] === 'ext_id') {
-                    ext_id2 = cookieParts[1];
-                }
+                        if (cookieParts[0] === 'ext_id') {
+                            ext_id2 = cookieParts[1];
+                        }
 
-                if (cookieParts[0] === 'luid') {
-                    luid2 = cookieParts[1];
-                }
-            }
+                        if (cookieParts[0] === 'luid') {
+                            luid2 = cookieParts[1];
+                        }
+                    }
 
-            // Use the values as needed
-            if (ext_id2 && luid2) {
-                console.log(`ext_id: ${ext_id2}, luid: ${luid2}`);
-            } else {
-                console.log('User Data Not Detected! Please Sign In.');
-                window.location = "/";
-            }
-        </script>
+                    // Use the values as needed
+                    if (ext_id2 && luid2) {
+                        console.log(`ext_id: ${ext_id2}, luid: ${luid2}`);
 
-        <details>
-            <summary>Developer Only Information</summary>
-            For Development purposes only, send statistics found in this menu when encontering UI Errors.
-        </details>
\ No newline at end of file
+                    } else {
+                        console.log('User Data Not Detected! Please Sign In.');
+                        window.location = "/";
+                    }
+                </script>
+
+                <% if(userdata.icon_id===10) { %>
+                    <img id="user-image" src="" alt="User Image">
+
+                    <script>
+                        const userImage = document.getElementById('user-image');
+                        userImage.src = "images/" + ext_id2 + '-up.jpg';
+                    </script>
+
+                    <% } else {%>
+                        <img id="user-image" src="" alt="User Image">
+
+                        <script data-userdata="<%=JSON.stringify(userdata)%>">
+                            const userdata = JSON.parse(document.currentScript.getAttribute('data-userdata'));
+                            const userImage = document.getElementById('user-image');
+                            const UI_Icon = userdata.icon_id
+                            function padNumber(num, size) {
+                                var s = num + "";
+                                while (s.length < size) s = "0" + s;
+                                return s;
+                            }
+
+                            // Usage:
+                            userImage.src = "assets/icon/UI_Icon_" + padNumber(Number(UI_Icon),6) + '.png';
+                        </script>
+                        <%}%>
+
+                            <details>
+                                <summary>Developer Only Information</summary>
+                                For Development purposes only, send statistics found in this menu when encontering UI
+                                Errors.
+                                <details>
+                                    <summary>Raw User Details</summary>
+                                    <pre><code><%=JSON.stringify(userdata, null, 2)%></code></pre>
+                                </details>
+                            </details>
+            </div>
\ No newline at end of file
