diff --git a/templates/home_authenticated.html b/templates/home_authenticated.html
new file mode 100644
index 0000000000000000000000000000000000000000..bf6dd33b8fc704d7720353f9e28af61f53eb1be7
--- /dev/null
+++ b/templates/home_authenticated.html
@@ -0,0 +1,95 @@
+<!DOCTYPE html>
+<html lang="en-GB">
+    <head>
+        <title>umu</title>
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <meta name="title" content="umu">
+        <meta name="description" content="umu">
+        <style>
+         html {
+             background: #1C1C1C;
+             color: #DCDCDC;
+             font-family: sans-serif;
+             text-align: center;
+             height: 100%;
+             margin: 0 auto;
+         }
+         body {
+             min-height: 100%;
+             padding: 0;
+             margin: 0 auto;
+             display: flex;
+             flex-direction: column;
+             justify-content: center;
+             max-width: 450px;
+         }
+         .title {
+             font-size: 50px;
+         }
+         form {
+             margin: 0 auto;
+             width: min(300px, calc(70% + 100px));
+             text-align: left;
+             display: flex;
+             justify-content: center;
+             flex-direction: column;
+         }
+         form > * {
+             margin-bottom: 0.3em;
+         }
+         label {
+             flex: 0 0 auto;
+         }
+         input {
+             font-family: inherit;
+         }
+         .input {
+             width: 100%;
+             display: flex;
+             justify-content: space-between;
+         }
+         details {
+             margin: 20px 0;
+         }
+         .link_info {
+             text-align: left;
+         }
+         table {
+             text-align: center;
+         }
+         tr:nth-child(even) {
+             background-color: #2B2B2B;
+         }         td > p {
+             font-family: monospace;
+         }
+         td {
+             padding: 10px;
+         }
+        </style>
+    </head>
+    <body>
+        <p class="title">umu</p>
+        <form>
+            <div class="input">
+                <label for="url">URL:</label>
+                <input type="text" id="url" name="url">
+            </div>
+            <div class="input">
+                <label for="name">Name (optional):</label>
+                <input type="text" id="name" name="name">
+            </div>
+            <input type="submit" value="Shorten URL">
+        </form>
+        <details>
+            <summary>Shortened URLs</summary>
+            <div class="link_info">
+                <table>
+                    <th>Short link</th>
+                    <th>Long link</th>
+                    <th>Actions</th>
+                    {{ . }}
+                </table>
+            </div>
+        </details>
+    </body>
+</html>
diff --git a/templates/login.html b/templates/login.html
new file mode 100644
index 0000000000000000000000000000000000000000..e753385248eae78a453b66d425169101164ebab3
--- /dev/null
+++ b/templates/login.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html lang="en-GB">
+    <head>
+        <title>Log in | umu</title>
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <meta name="title" content="Log in | umu">
+        <meta name="description" content="Log in | umu">
+        <style>
+         html {
+             background: #1C1C1C;
+             color: #dcdcdc;
+             font-family: sans-serif;
+             text-align: center;
+             height: 100%;
+             margin: 0 auto;
+         }
+         body {
+             height: 100%;
+             padding: 0;
+             margin: 0 auto;
+             display: flex;
+             flex-direction: column;
+             justify-content: center;
+             max-width: 450px;
+         }
+         p {
+             font-size: 50px;
+         }
+         form {
+             display: flex;
+             align-items: center;
+             justify-content: center;
+             flex-wrap: wrap;
+             gap: 10px;
+         }
+         label {
+             flex: 0 0 auto;
+             font-size: 30px;
+         }
+         input {
+             font-family: inherit;
+         }
+        </style>
+    </head>
+    <body>
+        <p>umu</p>
+        <form>
+            <label for="access_token">Access token:</label>
+            <input type="password" id="access_token" name="access_token">
+            <input type="submit" value="Log in">
+        </form>
+    </body>
+</html>
