diff --git a/static/fontawesome-webfont.woff2 b/static/fontawesome-webfont.woff2
index d2a3f99..082ba37 100644
Binary files a/static/fontawesome-webfont.woff2 and b/static/fontawesome-webfont.woff2 differ
diff --git a/static/juice.css b/static/juice.css
index 510818c..9fdb417 100644
--- a/static/juice.css
+++ b/static/juice.css
@@ -4,6 +4,29 @@ body {
 	margin: 0;
 }
 
+.font-awesome {
+	font-family: FontAwesome;
+}
+
+nav {
+	background-color: whitesmoke;
+	border-bottom: 1px solid darkgray;
+	display: flex;
+}
+
+nav span {
+	color: dimgrey;
+	cursor: pointer;
+	transition: 0.1s;
+	padding: 0.5em;
+	margin-left: 0.5em;
+	margin-right: 0.5em;
+}
+
+nav span:hover {
+	background-color: lightgray;
+}
+
 #devices {
 	padding: 5%;
 	display: flex;
@@ -53,7 +76,6 @@ body {
 }
 
 .edit, .save {
-	font-family: FontAwesome;
 	font-size: 0.8em;
 	color: dimgrey;
 }
diff --git a/static/juice.js b/static/juice.js
index edd17cb..a89f260 100644
--- a/static/juice.js
+++ b/static/juice.js
@@ -55,7 +55,7 @@ function edit_field(field) {
 
 	let save = document.createElement('span');
 	save.innerHTML = '&#xe801;';
-	save.className = 'save';
+	save.className = 'save font-awesome';
 	save.setAttribute('onclick', 'save_field(this.parentElement)');
 	field.children[1].replaceWith(save);
 }
@@ -93,7 +93,7 @@ function save_field(field) {
 
 		let edit = document.createElement('span');
 		edit.innerHTML = '&#xe800;';
-		edit.className = 'edit';
+		edit.className = 'edit font-awesome';
 		edit.setAttribute('onclick', 'edit_field(this.parentElement)');
 		field.children[1].replaceWith(edit);
 	});
diff --git a/templates/index.html b/templates/index.html
index 8e035d7..03eabf5 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -8,20 +8,26 @@
 		<script>window.onload = load;</script>
 	</head>
 	<body>
+		<header>
+			<nav>
+				<span onclick="new_device()" title="Add new device"><span class="font-awesome">&#xe802;</span></span>
+				<span title="Register a new authenticator">Register</span>
+			</nav>
+		</header>
 		<main>
 			<div id="devices">
 				{% for device in network %}
 				<div class="device {{ device.type }}" id="{{ device.id }}">
 					<div class="id">{{ device.id }}</div>
-					<div class="description"><span class="field_value">{{ device.description }}</span> <span class="edit" onclick="edit_field(this.parentElement)">&#xe800;</span></div>
-					<div class="location"><span class="field_value">{{ device.location }}</span> <span class="edit" onclick="edit_field(this.parentElement)">&#xe800;</span></div>
+					<div class="description"><span class="field_value">{{ device.description }}</span> <span class="edit font-awesome" onclick="edit_field(this.parentElement)">&#xe800;</span></div>
+					<div class="location"><span class="field_value">{{ device.location }}</span> <span class="edit font-awesome" onclick="edit_field(this.parentElement)">&#xe800;</span></div>
 					<div class="ip_address"><i>{{ device.ip_address }}</i></div>
 					<div class="sub_devices">
 						{% for sub_dev in device.sub_devices %}
 						<div class="sub_device {{ sub_dev.type }}" id="{{ sub_dev.id }}">
 							<div class="id">{{ sub_dev.id }}</div>
 							<object class="outlet_image" data="/static/outlet.svg"></object>
-							<div class="description"><span class="field_value">{{ sub_dev.description }}</span> <span class="edit" onclick="edit_field(this.parentElement)">&#xe800;</span></div>
+							<div class="description"><span class="field_value">{{ sub_dev.description }}</span> <span class="edit font-awesome" onclick="edit_field(this.parentElement)">&#xe800;</span></div>
 						</div>
 						{% endfor %}
 					</div>
