diff --git a/theme/templates/category.html b/theme/templates/category.html
index 56f8e93..253cf59 100644
--- a/theme/templates/category.html
+++ b/theme/templates/category.html
@@ -1,2 +1,74 @@
-{% extends "index.html" %}
-{% block title %}{{ SITENAME }} - {{ category }}{% endblock %}
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <title>{% block title %}{{ SITENAME }}{%endblock%}</title>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
+  <link rel="stylesheet" href="{{ SITEURL }}/theme/css/tachyons.min.css" type="text/css" />
+  <script type="text/javascript" src="{{ SITEURL }}/theme/js/jquery-3.5.0.min.js"></script>
+  <style>
+   body {
+     font: 0.75em/1.5 AppleGothic, Sans-serif;
+   }
+
+   a {
+     color: black;
+     text-decoration: none;
+   }
+
+   p {
+     margin: 0;
+   }
+
+   article.title {
+     font-size: 1.2em;
+   }
+
+   time {
+     font-size: 0.65em;
+   }
+  </style>
+</head>
+
+<body>
+
+  <div style="margin: 1em;">
+
+    <a class="w-100 black o-10 db pb5" href="{{ SITEURL }} " title="title">
+      <div class="b black" style="font-size: 3.6em;">
+        {{ SITENAME }}
+      </div>
+    </a>
+
+    {% for article in articles %}
+
+    <article class="title">
+      <a href="{{ SITEURL }}/{{ article.url }}" class="db b pb2 o-50">
+        {{ article.title }}
+      </a>
+    </article>
+
+    <div>
+      {{ article.content }}
+    </div>
+
+    {% if not HIDE_DATE %}
+    <time class="db w-100 tr pb4 o-30" datetime="{{ article.date.isoformat() }}">
+      {{ article.date.isoformat() }}
+    </time>
+    {% endif %}
+
+    {% endfor %}
+
+  </div>
+
+  <script type="text/javascript">
+    $(document).ready(function () {
+      $('a[class*=external]').attr('target', '_blank').css('background-color', 'rgba(0, 0, 0, 0.1)');
+    });
+  </script>
+
+</body>
+
+</html>
