diff --git a/app/src/pages/ToolsPage.jsx b/app/src/pages/ToolsPage.jsx
new file mode 100644
index 0000000..6c93c30
--- /dev/null
+++ b/app/src/pages/ToolsPage.jsx
@@ -0,0 +1,40 @@
+import { useNav } from '../../teknav-ui.jsx';
+import { iconNode } from '../../src/lib/icon.jsx';
+import squarePenIcon from '../../src/assets/icons/square-pen.svg';
+import rulerIcon from '../../src/assets/icons/ruler.svg';
+import { LegalPage, LegalSection } from './shared.jsx';
+
+export function ToolsPage() {
+  const { navigate } = useNav();
+  return (
+    <LegalPage title="ابزارهای تخصصی توسعه‌دهندگان" subtitle="ابزارهای کمکی و محاسباتی برای پردازش زبان طبیعی فارسی (NLP)، هوش مصنوعی و بازیابی اطلاعات (RAG).">
+      <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(280px, 1fr))', gap: 20 }}>
+        {[
+          {
+            title: 'نرمال‌ساز متن فارسی (NLP)',
+            desc: 'اصلاح حروف عربی، تنظیم نیم‌فاصله‌ها، حذف کدهای HTML و فاصله‌های مکرر در متون فارسی برای پیش‌پردازش سیستم‌های هوش مصنوعی.',
+            path: '/tools/nlp-normalizer',
+            icon: squarePenIcon,
+          },
+          {
+            title: 'محاسبه‌گر چانک و زمینه RAG',
+            desc: 'شبیه‌سازی تکه‌بندی متون، همپوشانی (Overlap)، محاسبه تعداد چانک‌ها و برآورد تعداد توکن‌های فارسی برای پایپ‌لاین‌های Retrieval-Augmented Generation.',
+            path: '/tools/rag-calculator',
+            icon: rulerIcon,
+          },
+        ].map((t) => (
+          <div key={t.path} style={{ background: '#FAF7F0', border: '1px solid #E4DDD2', borderRadius: 12, padding: 24, display: 'flex', flexDirection: 'column', justifyContent: 'space-between' }}>
+            <div>
+              <div style={{ fontSize: 32, marginBottom: 12 }}>{iconNode(t.icon)}</div>
+              <h2 style={{ fontSize: 17, fontWeight: 800, color: '#0F2A2E', marginBottom: 10 }}>{t.title}</h2>
+              <p style={{ color: '#5F6B6D', fontSize: 13, lineHeight: 1.8, marginBottom: 20 }}>{t.desc}</p>
+            </div>
+            <button onClick={() => navigate(t.path)} style={{ background: '#0F6B73', color: '#fff', border: 'none', borderRadius: 8, padding: '10px 18px', fontSize: 13, fontWeight: 600, cursor: 'pointer', fontFamily: 'Vazirmatn,sans-serif', width: '100%' }}>
+              ورود به ابزار
+            </button>
+          </div>
+        ))}
+      </div>
+    </LegalPage>
+  );
+}