diff --git a/error-404.hbs b/error-404.hbs
index 83c3dd8..020d82d 100644
--- a/error-404.hbs
+++ b/error-404.hbs
@@ -5,7 +5,7 @@
     <h2 class="text-4xl md:text-6xl font-bold mb-12">Page Not Found</h2>
     
     <a href="{{@site.url}}" class="btn-primary">
-        &larr; Back to Home
+        <span class="mr-2">{{> "icons/arrow-left"}}</span> Back to Home
     </a>
 
     {{#get "posts" limit="3" include="tags,authors"}}
diff --git a/partials/icons/arrow-left.hbs b/partials/icons/arrow-left.hbs
new file mode 100644
index 0000000..4370a69
--- /dev/null
+++ b/partials/icons/arrow-left.hbs
@@ -0,0 +1,3 @@
+<svg class="w-4 h-4 inline-block" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"></path>
+</svg>
diff --git a/partials/icons/arrow-right.hbs b/partials/icons/arrow-right.hbs
new file mode 100644
index 0000000..a1c944f
--- /dev/null
+++ b/partials/icons/arrow-right.hbs
@@ -0,0 +1,3 @@
+<svg class="w-4 h-4 inline-block" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3"></path>
+</svg>
diff --git a/partials/post-navigation.hbs b/partials/post-navigation.hbs
index 1b8c4bc..f135cbe 100644
--- a/partials/post-navigation.hbs
+++ b/partials/post-navigation.hbs
@@ -2,7 +2,10 @@
     {{#prev_post}}
         <div class="prev-post-nav">
             <a href="{{url}}" class="group block p-6 bg-[var(--bg-secondary)] rounded-lg hover:bg-[var(--bg-tertiary)] transition-all duration-300">
-                <span class="text-xs uppercase tracking-widest text-[var(--text-tertiary)] mb-2 block">&larr; Previous Post</span>
+                <span class="text-xs uppercase tracking-widest text-[var(--text-tertiary)] mb-2 block flex items-center">
+                    <span class="mr-2">{{> "icons/arrow-left"}}</span>
+                    Previous Post
+                </span>
                 <h4 class="text-xl font-bold group-hover:text-[var(--brand-primary)] transition-colors duration-300">{{title}}</h4>
             </a>
         </div>
@@ -11,7 +14,10 @@
     {{#next_post}}
         <div class="next-post-nav text-right md:col-start-2">
             <a href="{{url}}" class="group block p-6 bg-[var(--bg-secondary)] rounded-lg hover:bg-[var(--bg-tertiary)] transition-all duration-300">
-                <span class="text-xs uppercase tracking-widest text-[var(--text-tertiary)] mb-2 block">Next Post &rarr;</span>
+                <span class="text-xs uppercase tracking-widest text-[var(--text-tertiary)] mb-2 block flex items-center justify-end">
+                    Next Post
+                    <span class="ml-2">{{> "icons/arrow-right"}}</span>
+                </span>
                 <h4 class="text-xl font-bold group-hover:text-[var(--brand-primary)] transition-colors duration-300">{{title}}</h4>
             </a>
         </div>