diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx
new file mode 100644
index 0000000..2e5b34f
--- /dev/null
+++ b/src/app/dashboard/page.tsx
@@ -0,0 +1,68 @@
+"use client";
+
+import { useContentStore } from "@/store/contentStore";
+import StatsCard from "@/components/dashboard/StatsCard";
+import RecentPosts from "@/components/dashboard/RecentPosts";
+import { FileText, Eye, Edit, Trash2 } from "lucide-react";
+
+export default function DashboardPage() {
+  const { posts } = useContentStore();
+
+  const publishedCount = posts.filter((p) => p.status === "published").length;
+  const draftCount = posts.filter((p) => p.status === "draft").length;
+  const totalViews = posts.reduce((acc, p) => acc + (p.views ?? 0), 0);
+
+  const stats = [
+    {
+      title: "Total Posts",
+      value: posts.length,
+      icon: FileText,
+      color: "bg-blue-500",
+      textColor: "text-blue-600",
+      bgColor: "bg-blue-50",
+    },
+    {
+      title: "Published",
+      value: publishedCount,
+      icon: Eye,
+      color: "bg-green-500",
+      textColor: "text-green-600",
+      bgColor: "bg-green-50",
+    },
+    {
+      title: "Drafts",
+      value: draftCount,
+      icon: Edit,
+      color: "bg-yellow-500",
+      textColor: "text-yellow-600",
+      bgColor: "bg-yellow-50",
+    },
+    {
+      title: "Total Views",
+      value: totalViews,
+      icon: Trash2,
+      color: "bg-purple-500",
+      textColor: "text-purple-600",
+      bgColor: "bg-purple-50",
+    },
+  ];
+
+  return (
+    <div className="space-y-6">
+      <div>
+        <h1 className="text-2xl font-bold text-gray-900">Dashboard</h1>
+        <p className="text-gray-500 mt-1">
+          Welcome back! Here's an overview of your content.
+        </p>
+      </div>
+
+      <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
+        {stats.map((stat) => (
+          <StatsCard key={stat.title} {...stat} />
+        ))}
+      </div>
+
+      <RecentPosts />
+    </div>
+  );
+}