diff --git a/.gitattributes b/.gitattributes
index 213e0cb..0b5b3d4 100644
--- a/.gitattributes
+++ b/.gitattributes
@@ -1,2 +1,3 @@
 *.jpg filter=lfs diff=lfs merge=lfs -text
 *.jpeg filter=lfs diff=lfs merge=lfs -text
+*.pxm filter=lfs diff=lfs merge=lfs -text
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index d4dca3f..a5f0953 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -19,13 +19,13 @@
   <link rel="preload" as="image" href="{{ printf `%s.svg` . | absURL }}">
   {{- end -}}
 
-  <link rel="icon" href="{{ `favicon.ico` | absURL }}">
-  <link rel="apple-touch-icon" href="{{ `apple-touch-icon.png` | absURL }}">
+  <link rel="icon" type="image/png" href="{{ `icons/favicon.png` | relURL }}">
+  <link rel="apple-touch-icon" type="image/png" href="{{ `icons/touchicon.png` | relURL }}">
 
   {{ hugo.Generator }}
 
   {{- range .AlternativeOutputFormats -}}
-  <link rel="{{ .Rel }}" type="{{ .MediaType.Type }}" href="{{ .Permalink }}" title="{{ site.Title }}">
+  <link rel="{{ .Rel }}" type="{{ .MediaType.Type }}" href="{{ .RelPermalink }}" title="{{ site.Title }}">
   {{- end -}}
 
   {{- if or hugo.IsProduction (eq site.Params.env "production") -}}
diff --git a/logo.html b/logo.html
index 5c82de5..6f27208 100644
--- a/logo.html
+++ b/logo.html
@@ -1,8 +1,13 @@
 <!doctype html>
 <html>
     <body>
-        <h1>Site Logo</h1>
-        <div id="logo">E</div>
+        <header>
+            <h1>Site Logo</h1>
+        </header>
+        <main>
+            <div class="logo" id="touchicon"><span>E</span></div>
+            <div class="logo" id="favicon"><span>E</span></div>
+        </main>
     </body>
 <style>
 @font-face {
@@ -19,28 +24,32 @@
     --purple: rgb(161, 49, 232);
     --lilac: rgb(187, 121, 245);
 }
-* { box-sizing: border-box; }
 body {
+    align-items: center;
     color: #222;
-    padding-block-start: 6vmin;
     display: flex;
     flex-direction: column;
-    align-items: center;
-    width: 100%;
-    height: 100%;
+    padding-block-start: 6vmin;
     font-family: "Museo_Slab";
 }
-#logo {
+main {
+    align-items: center;
+    display: flex;
+    gap: 2rem;
+    margin: 0 auto;
+}
+.logo {
+    border: 1px dotted #aaa;
     color: transparent;
-    border: 0.5rem solid #222;
-    border-radius: 6px;
-    padding-top: 30px;
     display: flex;
     justify-content: center;
     align-items: center;
-    width: 500px;
-    height: 500px;
-    background-color: blue;
+    text-align: center;
+    line-height: 1;
+}
+.logo > span {
+    display: block;
+    position: relative;
     background:
         radial-gradient(circle at 20% 70%, var(--purple), transparent 40%),
         radial-gradient(circle at 30% 30%, var(--lt-blue), var(--mid-blue) 20%, transparent 80%),
@@ -49,9 +58,22 @@ body {
         radial-gradient(circle at 45% 100%, var(--lilac), var(--purple) 60%),
         radial-gradient(ellipse at 50% 50%, var(--dk-blue), transparent 80%);
     background-clip: text;
+}
+#touchicon {
     font-size: 600px;
-    text-align: center;
-    line-height: 0.8;
+    width: 512px;
+    height: 512px;
+}
+#touchicon > span {
+    top: 15px;
+}
+#favicon {
+    font-size: 24px;
+    width: 24px;
+    height: 24px;
+}
+#favicon > span {
+    top: 0.5px;
 }
 </style>
 </html>
diff --git a/logo.png b/logo.png
new file mode 100644
index 0000000..7eb6403
Binary files /dev/null and b/logo.png differ
diff --git a/logo.pxm b/logo.pxm
new file mode 100644
index 0000000..c56bf5e
--- /dev/null
+++ b/logo.pxm
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:ac330d86c788701d3f4981bee56954b324844a4115e28611bba8028b2f43ee7b
+size 785132
diff --git a/static/icons/favicon.png b/static/icons/favicon.png
new file mode 100644
index 0000000..21f5ebc
Binary files /dev/null and b/static/icons/favicon.png differ
diff --git a/static/icons/touchicon.png b/static/icons/touchicon.png
new file mode 100644
index 0000000..337957f
Binary files /dev/null and b/static/icons/touchicon.png differ
