diff --git a/app/src/pages/TagPage.jsx b/app/src/pages/TagPage.jsx
new file mode 100644
index 0000000..ef76993
--- /dev/null
+++ b/app/src/pages/TagPage.jsx
@@ -0,0 +1,28 @@
+import { useState, useEffect } from 'react';
+import { EmptyState } from '../../teknav-ui.jsx';
+import { ArticleRow } from '../../teknav-articles.jsx';
+import { contentApi } from '../../src/lib/content-api.js';
+
+export function TagPage({ tag }) {
+  const decoded = decodeURIComponent(tag);
+  const [articles, setArticles] = useState(() => contentApi.fallbackArticles().filter((item) => item.tags?.includes(decoded)));
+  useEffect(() => {
+    let cancelled = false;
+    setArticles(contentApi.fallbackArticles().filter((item) => item.tags?.includes(decoded)));
+    contentApi.listArticles({ tag: decoded, limit: 100 })
+      .then((res) => { if (!cancelled) setArticles(res.items ?? []); })
+      .catch(() => {});
+    return () => { cancelled = true; };
+  }, [decoded]);
+  return (
+    <div style={{ paddingTop: 80, background: '#FAF7F0', minHeight: '100vh', fontFamily: 'Vazirmatn,sans-serif', direction: 'rtl' }}>
+      <div style={{ maxWidth: 960, margin: '0 auto', padding: '40px 24px' }}>
+        <h1 style={{ fontSize: 30, fontWeight: 900, color: '#263238', margin: '0 0 10px' }}>برچسب {decoded}</h1>
+        <p style={{ color: '#5F6B6D', lineHeight: 1.9, margin: '0 0 28px' }}>همه مقاله‌هایی که با این برچسب منتشر شده‌اند.</p>
+        {articles.length === 0 ? <EmptyState title="مقاله‌ای برای این برچسب پیدا نشد" /> : articles.map((article, index) => (
+          <ArticleRow key={article.id} article={article} idx={index} />
+        ))}
+      </div>
+    </div>
+  );
+}