diff --git a/assets/css/pretendo-common.css b/assets/css/pretendo-common.css
index 01a1614..cdce758 100644
--- a/assets/css/pretendo-common.css
+++ b/assets/css/pretendo-common.css
@@ -362,6 +362,9 @@ input[type="text"], input[type="password"], textarea {
 	box-sizing: border-box;
 	resize: none;
 }
+input[type="text"].inline, input[type="password"].inline, textarea.inline {
+	width: auto;
+}
 
 label {
 	font-size: 1em;
diff --git a/assets/css/pretendo-pnid.css b/assets/css/pretendo-pnid.css
index 0118f35..6b315d1 100644
--- a/assets/css/pretendo-pnid.css
+++ b/assets/css/pretendo-pnid.css
@@ -22,6 +22,31 @@ body footer .content {
     max-width: 100vw;
     padding: 3rem 4rem;
 }
+.infoContainer.hide {
+    display: none;
+}
+.infoList {
+    display: block;
+    padding: 1em 0;
+    font-weight: bold;
+    color: #000;
+    margin: 0;
+}
+.infoList span {
+    font-weight: normal;
+    display: inline-block;
+    color: #707070;
+    width: 6em;
+}
+.infoList + .infoList {
+    border-top: 1px solid #afafaf;
+}
+.infoContainer .btn {
+    margin-top: 1em;
+}
+.link-margin {
+    margin: 0 1em;
+}
 
 /* aside navigation */
 nav.userNav {
diff --git a/assets/js/api.js b/assets/js/api.js
index 26e42dc..efa373e 100644
--- a/assets/js/api.js
+++ b/assets/js/api.js
@@ -40,6 +40,24 @@ function login() {
 	}
 }
 
+function editInfo() {
+	var xhr = postAjax('/api/v1/editaccount', {
+		email: document.getElementById('email_input').value,
+		username: document.getElementById('username_input').value
+	});
+	xhr.onload = function () {
+		if (xhr.responseText.charAt(0) !== "{") {
+			return showErrorPopup('Whoops, something went wrong. Try again later.');
+		}
+		response = JSON.parse(xhr.responseText);
+		if (response.success === true) {
+			location.pathname = '/pnid/dashboard';
+		} else if (response.errors) {
+			showErrorPopup(response.errors);
+		}
+	}
+}
+
 function passwordForgot() {
 	var xhr = postAjax('/api/v1/passwordforgot', {
 		email: document.getElementById('email_input').value
diff --git a/assets/js/pnid.js b/assets/js/pnid.js
new file mode 100644
index 0000000..571669a
--- /dev/null
+++ b/assets/js/pnid.js
@@ -0,0 +1,4 @@
+function toggleEditInfo() {
+    document.getElementById('userInfo').classList.toggle('hide');
+    document.getElementById('editInfo').classList.toggle('hide');
+}
\ No newline at end of file
diff --git a/views/dashboard.hbs b/views/dashboard.hbs
index 62a7feb..6bee9e4 100644
--- a/views/dashboard.hbs
+++ b/views/dashboard.hbs
@@ -6,15 +6,31 @@
         <link rel="stylesheet" href="/assets/css/pretendo-pnid.css">
         <!-- scripts -->
         <script src="/assets/js/api.js"></script>
+        <script src="/assets/js/pnid.js"></script>
     </head>
     <body class="flex">
         {{> nav-default }}
-        <div id="email_verification_popup" class="email_popup{{#if_eq user.email_validated true}} hide{{/if_eq}}"><p>{{ locale.verify_email_popup.text }}</p><span><button class="btn-alt small">{{ locale.verify_email_popup.change_button_text }}</button> <button class="btn small" onclick="email_resend();">{{ locale.verify_email_popup.repeat_button_text }}</button></span></div>
+        <div id="email_verification_popup" class="email_popup{{#if_eq user.user.email_validated true}} hide{{/if_eq}}"><p>{{ locale.verify_email_popup.text }}</p><span><button class="btn-alt small" onclick="toggleEditInfo();">{{ locale.verify_email_popup.change_button_text }}</button> <button class="btn small" onclick="email_resend();">{{ locale.verify_email_popup.repeat_button_text }}</button></span></div>
         <div class="contentWrapper userPage">
             {{> nav-dashboard }}
             <section class="contentCard">
                 <p class="txt-highlight">{{ locale.dashboard.account.caption }}</p>
                 <h1 class="txt-title small">{{ locale.dashboard.account.title }}</h1>
+                <div class="infoContainer" id="userInfo">
+                    <p class="infoList"><span>Username:</span> {{ user.user.pnid.username }}</p>
+                    <p class="infoList"><span>Email:</span> {{ user.user.email }}</p>
+                    <button class="btn small btn-alt" onclick="toggleEditInfo();">Edit</button>
+                </div>
+                <div class="infoContainer hide" id="editInfo">
+                    <div id="errorBox" class="error hide"></div>
+                    <p class="infoList"><span>Username:</span>
+                        <input type="text" class="inline" name="username_input" id="username_input" value="{{ user.user.pnid.username }}">
+                    </p>
+                    <p class="infoList"><span>Email:</span>
+                        <input type="text" class="inline" name="email_input" id="email_input" value="{{ user.user.email }}">
+                    </p>
+                    <button class="btn small" onclick="editInfo();">Save</button><a href="#" class="link-margin" onclick="toggleEditInfo();">Cancel</a>
+                </div>
             </section>
         </div>  
         {{> footer-default }}
