diff --git a/package.json b/package.json
index 591a3a0..4e7b8fc 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
     "@solidjs/start": "^1.3.2",
     "lucide-solid": "^1.7.0",
     "solid-js": "^1.9.5",
+    "solid-markdown": "^0.5.0",
     "vinxi": "^0.5.7"
   },
   "devDependencies": {
diff --git a/src/routes/help-center/article/[slug].tsx b/src/routes/help-center/article/[slug].tsx
index c51666c..8a68817 100644
--- a/src/routes/help-center/article/[slug].tsx
+++ b/src/routes/help-center/article/[slug].tsx
@@ -1,6 +1,7 @@
 import { A, useParams } from '@solidjs/router';
 import { Meta, Title } from '@solidjs/meta';
 import { Show, For, createSignal, createResource, onCleanup, onMount, createMemo } from 'solid-js';
+import Markdown from 'solid-markdown';
 import { fetchArticleBySlug, fetchRelatedArticles } from '~/lib/help-center';
 import PublicBackground from '~/components/PublicBackground';
 import PublicHeader from '~/components/PublicHeader';
@@ -95,11 +96,9 @@ export default function HelpCenterArticlePage() {
 
                   <p class="note">Updated {new Date(a().updatedAt).toLocaleDateString()}</p>
 
-                  <div class="help-article-body">
-                    <For each={a().content.split('\n\n').filter(Boolean)}>
-                      {(para) => <p>{para}</p>}
-                    </For>
-                  </div>
+                   <div class="help-article-body">
+                     <Markdown>{a().content}</Markdown>
+                   </div>
 
                   <div class="actions">
                     <A class="btn" href="/help-center">Back to Help Center</A>