diff --git a/_includes/layouts/post.njk b/_includes/layouts/post.njk
index 39f413b..5c547b3 100644
--- a/_includes/layouts/post.njk
+++ b/_includes/layouts/post.njk
@@ -19,6 +19,17 @@ include "public/css/header.css" %}{% endcss %} {%- css %}{% include
 
 <main id="skip">
 	<div class="blog-content">
+		<ul class="post-metadata">
+			{%- for tag in tags | filterTagList %} {%- set tagUrl %}/tags/{{
+				tag | slugify
+			}}/{% endset %}
+			<li>
+				<a href="{{ tagUrl }}" class="post-tag">{{ tag }}</a
+				>{%- if not loop.last %} {% endif %}
+			</li>
+			{%- endfor %}
+		</ul>
+
 		{{ content | safe }}
 	</div>
 </main>
@@ -35,17 +46,6 @@ include "public/css/header.css" %}{% endcss %} {%- css %}{% include
 			<a class="fat-hover-link" href="{{ nextPost.url }}">Next post</a>
 			{% endif %}
 		</div>
-
-		<ul class="post-metadata">
-			{%- for tag in tags | filterTagList %} {%- set tagUrl %}/tags/{{
-				tag | slugify
-			}}/{% endset %}
-			<li>
-				<a href="{{ tagUrl }}" class="post-tag">{{ tag }}</a
-				>{%- if not loop.last %}, {% endif %}
-			</li>
-			{%- endfor %}
-		</ul>
 		{%- endif %} {%- endif %}
 	</div>
 </div>
diff --git a/content/tags-list.njk b/content/tags-list.njk
index 3050c9c..7101c9b 100644
--- a/content/tags-list.njk
+++ b/content/tags-list.njk
@@ -2,11 +2,25 @@
 permalink: /tags/
 layout: layouts/home.njk
 ---
-<h1>Tags</h1>
-
-<ul>
-{% for tag in collections.all | getAllTags | filterTagList %}
-	{% set tagUrl %}/tags/{{ tag | slugify }}/{% endset %}
-	<li><a href="{{ tagUrl }}" class="post-tag">{{ tag }}</a></li>
-{% endfor %}
-</ul>
+
+{%- css %}{% include "public/css/header.css" %}{% endcss %} {%- css %}{% include
+"public/css/tags.css" %}{% endcss %}
+
+<header>
+	<div class="header-content">
+		<a class="home-link" href="/">Home</a>
+		<h1>Tags</h1>
+		<p>A list of all tags.</p>
+	</div>
+</header>
+
+<main id="skip">
+	<div class="tags-content tags-list">
+		{% for tag in collections.all | getAllTags | filterTagList %} {% set tagUrl
+		%}/tags/{{ tag | slugify }}/{% endset %}
+
+		<a href="{{ tagUrl }}" class="post-tag">{{ tag }}</a>
+
+		{% endfor %}
+	</div>
+</main>
diff --git a/content/tags.njk b/content/tags.njk
index 437598a..e6218b6 100644
--- a/content/tags.njk
+++ b/content/tags.njk
@@ -14,9 +14,20 @@ eleventyComputed:
   title: Tagged “{{ tag }}”
 permalink: /tags/{{ tag | slugify }}/
 ---
-<h1>Tagged “{{ tag }}”</h1>
 
-{% set postslist = collections[ tag ] %}
-{% include "postslist.njk" %}
+{%- css %}{% include "public/css/header.css" %}{% endcss %} {%- css %}{% include
+"public/css/tags.css" %}{% endcss %}
 
-<p>See <a href="/tags/">all tags</a>.</p>
+<header>
+	<div class="header-content">
+		<a class="home-link" href="/">Home</a>
+		<h1>Tagged "{{ tag }}"</h1>
+		<p>See <a class="fat-hover-link" href="/tags/">all tags</a>.</p>
+	</div>
+</header>
+
+<main id="skip">
+	<div class="tags-content">
+		{% set postslist = collections[ tag ] %} {% include "postslist.njk" %}
+	</div>
+</main>
diff --git a/public/css/index.css b/public/css/index.css
index 37eaef9..d25723a 100644
--- a/public/css/index.css
+++ b/public/css/index.css
@@ -282,12 +282,19 @@ footer p {
 
 /* Tags */
 .post-tag {
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
 	text-transform: capitalize;
-	font-style: italic;
 	font-weight: 500;
+	border: 2px solid black;
+	padding: 0.5rem 1rem;
+	border-radius: 30px;
+	text-decoration: unset;
+	background-color: var(--colour-purple);
+	transition: background-color 0.2s ease-out;
+}
+.post-tag:hover,
+.post-tag:focus {
+	background-color: var(--colour-black);
+	color: var(--colour-white);
 }
 .postlist-item > .post-tag {
 	align-self: center;
@@ -297,10 +304,11 @@ footer p {
 .post-metadata {
 	display: inline-flex;
 	flex-wrap: wrap;
-	gap: 0.5em;
+	gap: 1.2em;
 	list-style: none;
 	padding: 0;
 	margin: 0;
+	margin-bottom: 2rem;
 }
 .post-metadata time {
 	margin-right: 1em;
diff --git a/public/css/tags.css b/public/css/tags.css
new file mode 100644
index 0000000..df7dffb
--- /dev/null
+++ b/public/css/tags.css
@@ -0,0 +1,17 @@
+main {
+	display: flex;
+	justify-content: center;
+	margin: 8vw;
+}
+
+.tags-content {
+	width: 100%;
+	max-width: 900px;
+}
+
+.tags-list {
+	display: flex;
+	flex-wrap: wrap;
+	justify-content: center;
+	gap: 1.2em;
+}