diff --git a/components/content/ProjectCard.tsx b/components/content/ProjectCard.tsx
new file mode 100644
index 0000000..f447bad
--- /dev/null
+++ b/components/content/ProjectCard.tsx
@@ -0,0 +1,23 @@
+import { IconArrowNarrowRight } from '@tabler/icons-react';
+
+interface ProjectCardProps {
+    title: string; 
+    year: string; 
+    stack: string[]; 
+    description: string; 
+    outcome: string;
+}
+
+export default function ProjectCard({ title, year, stack, description, outcome }: ProjectCardProps) {
+  return (
+    <section className="space-y-2 border-t border-neutral-700 pt-4 flex flex-col mt-5">
+        <button className='flex justify-between hover:text-neutral-500 transition-colors items-center w-full text-left cursor-pointer group'>
+            <h1 className="text-[24px] font-semibold">{title}</h1>
+            <IconArrowNarrowRight className='group-hover:scale-150 transition-transform'/>
+        </button>
+        <p className="text-md text-neutral-400 text-muted">{year} — {stack.join(' · ')}</p>
+        <p className="text-xl">{description}</p>
+        <p className="text-md text-neutral-400 text-muted">{outcome}</p>
+    </section>
+  );
+}