diff --git a/assets/css/archive.css b/assets/css/archive.css
new file mode 100644
index 00000000..bff7c1a7
--- /dev/null
+++ b/assets/css/archive.css
@@ -0,0 +1,77 @@
+/* Archive
+-------------------------------------------------- */
+.archive {
+    width: 100%;
+    text-align: left;
+    margin: 0 auto;
+    margin-top: 14px;
+    margin-bottom: 14px;
+    font-size: 16px;
+}
+
+.archive-title {
+    margin-bottom: 2px;
+    font-size: 40px;
+    transform: translateX(-2px);
+}
+
+.archive-posts {
+    width: 100%
+}
+
+.archive-year {
+    margin-top: 40px;
+}
+
+.archive-year-header:not(:last-of-type) {
+    border-bottom: 1px solid var(--border)
+}
+
+.archive-year:not(:last-of-type) {
+    border-bottom: 1px solid var(--border)
+}
+
+.archive-month {
+    display: flex;
+    align-items: flex-start;
+    padding: 10px 0
+}
+
+.archive-month-header {
+    margin: 25px 0;
+    width: 200px;
+}
+
+.archive-month:not(:last-of-type) {
+    border-bottom: 1px solid var(--border)
+}
+
+.archive-entry {
+    position: relative;
+    padding: 5px;
+    margin: 10px 0;
+    transition: transform 0.1s;
+}
+
+.archive-entry:active {
+    transform: scale(0.96);
+}
+
+.archive-entry-title {
+    margin: 5px 0
+}
+
+.archive-meta {
+    color: var(--secondary);
+    font-size: 14px;
+}
+
+@media (max-width: 800px) {
+    .archive-month {
+        flex-direction: column
+    }
+
+    .archive-year {
+        margin-top: 20px
+    }
+}
\ No newline at end of file
diff --git a/layouts/_default/archives.html b/layouts/_default/archives.html
new file mode 100644
index 00000000..2d02b83c
--- /dev/null
+++ b/layouts/_default/archives.html
@@ -0,0 +1,38 @@
+{{ define "main" }}
+
+<div class="archive">
+  <h1 class="archive-title">{{ .Title }}</h1>
+
+  {{ range .Site.RegularPages.GroupByPublishDate "2006" }}
+  {{ if ne .Key "0001" }}
+  <div class="archive-year">
+    <h2 class="archive-year-header">{{ replace .Key "0001" "" }}</h2>
+    {{ range .Pages.GroupByDate "January" }}
+    <div class="archive-month">
+      <h3 class="archive-month-header">{{ .Key }}</h3>
+      <div class="archive-posts">
+        {{ range .Pages  }}
+        {{ if eq .Kind "page" }}
+        <div class="archive-entry">
+          <h3 class="archive-entry-title">
+            {{ .Title | markdownify }}
+          </h3>
+          <div class="archive-meta">
+            {{- if or .Params.author .Site.Params.author }}{{- .Params.author | default .Site.Params.author }} ·
+            {{ end }}
+            {{ if $.Site.Params.ShowReadingTime }}{{ .ReadingTime }}{{ $.Site.Params.MinuteReadingTime | default "min read" }}
+            · {{ end }}
+            {{- .Date.Format "January 2, 2006" -}}
+          </div>
+          <a class="entry-link" href="{{ .Permalink }}"></a>
+        </div>
+        {{ end }}
+        {{ end }}
+      </div>
+    </div>
+    {{ end }}
+  </div>
+  {{ end }}
+  {{ end }}
+</div>
+{{ end  }}{{/* end main */}}
\ No newline at end of file
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 501fcfc0..2e1fb14b 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -19,9 +19,10 @@
 {{ $main := resources.Get "css/main.css" | minify }}
 {{ $postentry := resources.Get "css/post-entry.css" | minify }}
 {{ $postsingle := resources.Get "css/post-single.css" | minify }}
+{{ $archive := resources.Get "css/archive.css" | minify }}
 {{ $footer := resources.Get "css/footer.css" | minify }}
 {{ $404 := resources.Get "css/404.css" | minify }}
-{{ $style := slice $theme $reset $header $main $postentry $postsingle $footer $404 | resources.Concat "stylesheet.css" | minify }}
+{{ $style := slice $theme $reset $header $main $postentry $postsingle $archive $footer $404 | resources.Concat "stylesheet.css" | minify }}
 {{ $stylesheet := slice $anoldhope $style | resources.Concat "css/stylesheet.css" | minify | fingerprint }}
 <link href="{{ $stylesheet.Permalink }}" integrity="{{ $stylesheet.Data.Integrity }}" rel="stylesheet">
 <link href="{{ "custom.css" | absURL }}" rel="stylesheet">