diff --git a/README.md b/README.md
index 9852a6a..7367e93 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,5 @@
+# ![](./img/feathermost.svg) Feathermost
+
 To run in development mode, execute `rundev.sh`.
 This will start a web server, and mitmproxy to avoid CORS problems.
 Dependencies for that: Bash, Python and [`mitmproxy`](https://mitmproxy.org/).
diff --git a/assets/feathermost.svg b/assets/feathermost.svg
new file mode 100644
index 0000000..27b5b4f
--- /dev/null
+++ b/assets/feathermost.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="20" height="20" version="1.1" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+	<path d="m15.876 1.9088 0.10531 2.1226c1.7207 1.901 2.3999 4.5932 1.5433 7.1234-1.2787 3.7771-5.4948 5.7626-9.4172 4.4347-3.9223-1.3277-6.0655-5.4661-4.7869-9.2431 0.85942-2.5387 3.0459-4.268 5.5783-4.7259l1.3682-1.6166c-4.2687-0.11553-8.2959 2.5341-9.7368 6.7905-1.7704 5.2298 1.034 10.905 6.2638 12.675 5.2298 1.7704 10.905-1.034 12.675-6.2639 1.4385-4.2496-0.14353-8.793-3.5931-11.297" fill="#211f1e"/>
+	<path d="m14.088 0.18611c-2.949 2.0501-4.6451 4.0857-5.4995 5.8449l0.55031 0.95054-0.6633-0.70972c-0.22057 0.4915-0.37422 0.95962-0.47175 1.3987l0.9144 0.97831-0.98725-0.59197c-0.28612 1.8724 0.49604 3.1322 1.5241 3.2524-0.35881-1.8001 2.191-7.5492 3.272-8.6437-1.1888 1.6761-3.3544 6.5967-2.9779 8.66 0.94305 0.0189 1.6754-0.21441 2.2174-1.1364l-1.498 0.20886 1.7873-0.79608c0.18886-0.44764 0.36498-1.0028 0.53624-1.6901l-1.347 0.43884 1.4523-0.8811c0.37979-1.6614 0.74537-4.0021 1.1906-7.2836zm-4.339 11.14c-0.093389-3e-3 -0.17276 7.8e-4 -0.29408-0.0164 0.065492 0.32214 0.00469 0.70281 0.058398 1.1769 0.030084 0.26557 0.034064 0.50318 0.15617 0.75233 0.17368-0.10889 0.46654-0.11338 0.4455-0.35553-0.01666-0.1918-0.11713-0.2967-0.18128-0.52938-0.11616-0.42133-0.13274-0.72968-0.1847-1.028z" fill="#211f1e"/>
+</svg>
diff --git a/assets/main.css b/assets/main.css
new file mode 100644
index 0000000..333b45f
--- /dev/null
+++ b/assets/main.css
@@ -0,0 +1,37 @@
+body {
+	font-family: sans-serif;
+	background-color: #eee;
+	color: #222;
+	max-width: 768px;
+	margin: 0 auto;
+	line-height: 1.5;
+}
+
+input {
+	font: inherit;
+	color: inherit;
+}
+
+h1 {
+	text-align: center;
+	line-height: 1.2;
+}
+h1 img {
+	width: 1em;
+	height: 1em;
+	vertical-align: middle;
+}
+
+#login {
+	text-align: center;
+}
+#login table {
+	margin: 0 auto 1em;
+}
+#login table th {
+	font-weight: normal;
+	text-align: right;
+}
+#login_server_row td, #login_server_row th {
+	padding-bottom: 1em;
+}
diff --git a/index.html b/index.html
index c0dfc79..4107c26 100644
--- a/index.html
+++ b/index.html
@@ -4,29 +4,38 @@
 		<meta charset="utf-8" />
 		<meta name="viewport" content="width=device-width" />
 		<title>Feathermost</title>
+		<link rel="stylesheet" href="/assets/main.css"/>
 	</head>
 	<body>
-		<form>
+		<div id="noscript">
+			<p>This application cannot work without JavaScript, unfortunately. In order to proceed, please enable it for this website.</p>
+			<p>Feathermost is an alternative webclient for the Mattermost chat platform. It is not possible to provide a JavaScript-less experience without having to trust us with your user data.</p>
+		</div>
+		<script type="text/javascript">document.body.innerHTML = "";</script>
+
+		<h1><img src="/assets/feathermost.svg" alt=""/> Feathermost</h1>
+		<form id="login">
+			<h2 id="add-a-server">Add a server</h2>
 			<table>
-				<tr><th>Server</th><td><input type="text" id="server" value="http://localhost:8080"/></td></tr>
-				<tr><th>Username</th><td><input type="text" id="username"/></td></tr>
-				<tr><th>Password</th><td><input type="password" id="password"/></td></tr>
+				<tr id="login_server_row">
+					<th>Server</th>
+					<td><input type="text" id="login_server" value="http://localhost:8080" required/></td>
+				</tr><tr>
+					<th>Username</th>
+					<td><input type="text" id="login_username" required/></td>
+				</tr><tr>
+					<th>Password</th>
+					<td><input type="password" id="login_password" required/></td>
+				</tr>
 			</table>
 
-			<input type="button" onclick="logIn(); return false" id="login" value="Log in"/>
-			<span id="login_message"></span><br/>
-
-			<input type="button" onclick="validateToken(); return false" id="validate" value="Validate token"/>
-			<span id="validate_message">(ignores username and password)</span><br/>
-
-			<input type="button" onclick="logOut(); return false" id="logout" value="Log out"/>
-			<span id="logout_message"></span><br/>
-
+			<input type="button" id="login_button" value="Log in"/>
+			<div id="login_message"></div>
 		</form>
 
 		<pre id="user_json"></pre>
 
-		<script type="text/javascript" src="ajax.js"></script>
-		<script type="text/javascript" src="main.js"></script>
+		<script type="text/javascript" src="/ajax.js"></script>
+		<script type="text/javascript" src="/main.js"></script>
 	</body>
 </html>
