diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 105aced..50e6f67 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -9,7 +9,6 @@
       "version": "0.0.1",
       "dependencies": {
         "@astrojs/node": "^10.0.3",
-        "@catppuccin/tailwindcss": "^1.0.0",
         "@tailwindcss/vite": "^4.2.2",
         "astro": "^6.0.8",
         "marked": "^17.0.5",
@@ -167,15 +166,6 @@
         "node": ">=18"
       }
     },
-    "node_modules/@catppuccin/tailwindcss": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@catppuccin/tailwindcss/-/tailwindcss-1.0.0.tgz",
-      "integrity": "sha512-l8pOlcYe2ncGd8a1gUmL5AHmKlxR2+CHuG5kt4Me6IZwzntW1DoLmj89BH+DcsPHBsdDGLrTSv35emlYyU3FeQ==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=22.0.0"
-      }
-    },
     "node_modules/@clack/core": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/@clack/core/-/core-1.1.0.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index 1531dd8..43c8208 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -13,7 +13,6 @@
   },
   "dependencies": {
     "@astrojs/node": "^10.0.3",
-    "@catppuccin/tailwindcss": "^1.0.0",
     "@tailwindcss/vite": "^4.2.2",
     "astro": "^6.0.8",
     "marked": "^17.0.5",
diff --git a/frontend/src/pages/posts/[slug].astro b/frontend/src/pages/posts/[slug].astro
index 06fdd3a..d27e552 100644
--- a/frontend/src/pages/posts/[slug].astro
+++ b/frontend/src/pages/posts/[slug].astro
@@ -71,10 +71,15 @@ function formatSlug(slug: string) {
     )}
 
     {post && (
-      <div class="prose prose-invert max-w-none" set:html={html} />
+      <div class="prose prose-invert max-w-none" id="post-content" set:html={html} />
     )}
   </article>
 
+  <!-- KaTeX for LaTeX Math Rendering -->
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/katex.min.css" integrity="sha384-wcixnb4m+ezBfu/FvC5sOkwP9b22Rk/Bq43H1rEof80A8o2D46rG1E+mI1R2bFwY" crossorigin="anonymous">
+  <script is:inline src="https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/katex.min.js" integrity="sha384-bO3k+X9sX7L9yI1eKRA32gSbx6Hj5v/F7rV+6hD4S7tU09QZfOa0W1B9TjJkC3O" crossorigin="anonymous"></script>
+  <script is:inline src="https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/contrib/auto-render.min.js" integrity="sha384-ks2B3Fey1s3qC3pS2aT5lC00u0d3W8e/2X2o551u0hGkQWjR0L0rYxYpA2Wn5+iA" crossorigin="anonymous"></script>
+
   <script>
     if (localStorage.getItem('admin_token')) {
       const editBtn = document.getElementById('edit-btn');
@@ -82,5 +87,22 @@ function formatSlug(slug: string) {
         editBtn.style.display = 'inline-flex';
       }
     }
+
+    // Initialize KaTeX auto-render on the post content
+    document.addEventListener("DOMContentLoaded", function() {
+        const content = document.getElementById('post-content');
+        if (content) {
+            // @ts-ignore
+            renderMathInElement(content, {
+                delimiters: [
+                    {left: '$$', right: '$$', display: true},
+                    {left: '$', right: '$', display: false},
+                    {left: '\\(', right: '\\)', display: false},
+                    {left: '\\[', right: '\\]', display: true}
+                ],
+                throwOnError: false
+            });
+        }
+    });
   </script>
 </Layout>