diff --git a/resources/templates/account_base.html b/resources/templates/account_base.html
index 9cbebdf..28edb33 100644
--- a/resources/templates/account_base.html
+++ b/resources/templates/account_base.html
@@ -2,7 +2,7 @@
 
 {% block body %}
 <main class="d-flex" style="height: 100vh">
-    <div class="d-flex flex-column p-3 text-bg-dark" style="width: 280px;">
+    <div class="d-flex flex-column p-3 text-bg-dark bg-body-tertiary" style="width: 280px;">
         <a href="/account/app/svc/manage" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-white text-decoration-none">
             <span class="fs-4">Manage Account</span>
         </a>
diff --git a/resources/templates/changepassword.html b/resources/templates/changepassword.html
index 3874900..593b272 100644
--- a/resources/templates/changepassword.html
+++ b/resources/templates/changepassword.html
@@ -5,10 +5,10 @@
 
 {% block accountbody %}
 <form method='post'>
-    <label for="old_password">Old Password:</label><br>
-    <input type='text' id='old_password' name='old_password'/><br>
-    <label for="new_password">New Password:</label><br>
-    <input type='text' id='new_ppassword' name='new_password'/><br>
-    <button type='submit'>Submit</button>
+    <label for="old_password" class="form-label">Old Password:</label><br>
+    <input type='password' id='old_password' name='old_password' class="form-control"/><br>
+    <label for="new_password" class="form-label">New Password:</label><br>
+    <input type='password' id='new_ppassword' name='new_password' class="form-control"/><br>
+    <button type='submit' class="btn btn-primary">Submit</button>
 </form>
 {% endblock %}
diff --git a/resources/templates/login.html b/resources/templates/login.html
index 446db77..280a9b9 100644
--- a/resources/templates/login.html
+++ b/resources/templates/login.html
@@ -1,14 +1,14 @@
-{% extends "layout.html" %}
+{% extends "login_base.html" %}
 
 {% block title %}Kawari - Login{% endblock %}
 
-{% block body %}
+{% block loginbody %}
 <form method='post'>
-    <label for="username">Username:</label><br>
-    <input type='text' id='username' name='username'/><br>
-    <label for="password">Password:</label><br>
-    <input type='text' id='password' name='password'/><br>
-    <button type='submit'>Login</button>
+    <label for="username" class="form-label">Username</label><br>
+    <input type='text' id='username' name='username' class="form-control"/><br>
+    <label for="password" class="form-label">Password</label><br>
+    <input id='password' name='password' class="form-control" type="password"/><br>
+    <button type='submit'  class="btn btn-primary">Login</button>
 </form>
 
 {% endblock %}
diff --git a/resources/templates/login_base.html b/resources/templates/login_base.html
new file mode 100644
index 0000000..0cefe64
--- /dev/null
+++ b/resources/templates/login_base.html
@@ -0,0 +1,9 @@
+{% extends "layout.html" %}
+
+{% block body %}
+<main>
+    <section class="py-5 text-center container" style="max-width:300px">
+        {% block loginbody %}{% endblock %}
+    </section>
+</main>
+{% endblock %}
diff --git a/resources/templates/register.html b/resources/templates/register.html
index af99de7..a99e0b2 100644
--- a/resources/templates/register.html
+++ b/resources/templates/register.html
@@ -1,13 +1,13 @@
-{% extends "layout.html" %}
+{% extends "login_base.html" %}
 
 {% block title %}Kawari - Register{% endblock %}
 
-{% block body %}
+{% block loginbody %}
 <form action='/oauth/oa/registlist' method='post'>
-    <label for="username">Username:</label><br>
-    <input type='text' id='username' name='username'/><br>
-    <label for="password">Password:</label><br>
-    <input type='text' id='password' name='password'/><br>
-    <button type='submit'>Register</button>
+    <label for="username" class="form-label">Username:</label><br>
+    <input type='text' id='username' name='username' class="form-control"/><br>
+    <label for="password" class="form-label">Password:</label><br>
+    <input id='password' name='password' class="form-control" type="password"/><br>
+    <button type='submit'  class="btn btn-primary">Register</button>
 </form>
 {% endblock %}
diff --git a/resources/templates/web.html b/resources/templates/web.html
index 8f3f92f..9a87bc3 100644
--- a/resources/templates/web.html
+++ b/resources/templates/web.html
@@ -1,11 +1,9 @@
-{% extends "layout.html" %}
+{% extends "web_base.html" %}
 
 {% block title %}Kawari{% endblock %}
 
-{% block body %}
-<p>Welcome to Kawari!</p>
-
-<a href="http://{{ login_server }}/oauth/oa/oauthlogin">Login</a>
-<a href="http://{{ login_server }}/oauth/oa/registligt">Signup</a>
-<a href="/worldstatus">World Status</a>
+{% block webbody %}
+<section class="py-5 text-center container">
+    <p>Welcome to Kawari!</p>
+</section>
 {% endblock %}
diff --git a/resources/templates/web_base.html b/resources/templates/web_base.html
new file mode 100644
index 0000000..367bf17
--- /dev/null
+++ b/resources/templates/web_base.html
@@ -0,0 +1,25 @@
+{% extends "layout.html" %}
+
+{% block body %}
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
+  <div class="container-fluid">
+    <a class="navbar-brand" href="/">Kawari</a>
+    <div class="collapse navbar-collapse" id="navbarNav">
+      <ul class="navbar-nav">
+        <li class="nav-item">
+          <a class="nav-link" href="http://{{ login_server }}/oauth/oa/oauthlogin">Login</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="http://{{ login_server }}/oauth/oa/registligt">Register</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="/worldstatus">World Status</a>
+        </li>
+      </ul>
+    </div>
+  </div>
+</nav>
+<main>
+    {% block webbody %}{% endblock %}
+</main>
+{% endblock %}
diff --git a/resources/templates/worldstatus.html b/resources/templates/worldstatus.html
index 26baa04..e7116ff 100644
--- a/resources/templates/worldstatus.html
+++ b/resources/templates/worldstatus.html
@@ -1,8 +1,10 @@
-{% extends "layout.html" %}
+{% extends "web_base.html" %}
 
 {% block title %}Kawari - World Status{% endblock %}
 
-{% block body %}
-<p>Worlds open: {{ worlds_open }}</p>
-<p>Login open: {{ login_open }}</p>
+{% block webbody %}
+<section class="py-5 text-center container">
+    <p>Worlds open: {{ worlds_open }}</p>
+    <p>Login open: {{ login_open }}</p>
+</section>
 {% endblock %}
diff --git a/src/bin/kawari-login.rs b/src/bin/kawari-login.rs
index 400bca8..2bacd3c 100644
--- a/src/bin/kawari-login.rs
+++ b/src/bin/kawari-login.rs
@@ -28,6 +28,12 @@ fn setup_default_environment() -> Environment<'static> {
             .expect("Failed to find template!"),
     )
     .unwrap();
+    env.add_template_owned(
+        "login_base.html",
+        std::fs::read_to_string("resources/templates/login_base.html")
+            .expect("Failed to find template!"),
+    )
+    .unwrap();
     env.add_template_owned(
         "login.html",
         std::fs::read_to_string("resources/templates/login.html")
diff --git a/src/bin/kawari-web.rs b/src/bin/kawari-web.rs
index ba0a387..2b28b7e 100644
--- a/src/bin/kawari-web.rs
+++ b/src/bin/kawari-web.rs
@@ -14,6 +14,12 @@ fn setup_default_environment() -> Environment<'static> {
             .expect("Failed to find template!"),
     )
     .unwrap();
+    env.add_template_owned(
+        "web_base.html",
+        std::fs::read_to_string("resources/templates/web_base.html")
+            .expect("Failed to find template!"),
+    )
+    .unwrap();
     env.add_template_owned(
         "web.html",
         std::fs::read_to_string("resources/templates/web.html").expect("Failed to find template!"),