diff --git a/src/pages/HomePage/sections/Hero.tsx b/src/pages/HomePage/sections/Hero.tsx
new file mode 100644
index 0000000..73007fd
--- /dev/null
+++ b/src/pages/HomePage/sections/Hero.tsx
@@ -0,0 +1,72 @@
+import React from 'react';
+import TextAnimation from '@/components/ui/TextAnimation';
+import ScrollReveal from '@/components/ui/ScrollReveal';
+import Button from '@/components/ui/Button';
+import Tag from '@/components/ui/Tag';
+
+export default function HeroSection() {
+  return (
+    <section id="hero" className="relative w-full overflow-hidden flex items-center min-h-svh">
+      <div className="max-w-content-width mx-auto px-6 grid lg:grid-cols-2 items-center relative z-10">
+        <div className="flex flex-col items-start gap-6">
+          <ScrollReveal variant="slide-up">
+            <Tag text="Daily Fresh" />
+          </ScrollReveal>
+          <TextAnimation
+            text="Taste the Tradition: Handcrafted Baked Goods Daily"
+            variant="fade-blur"
+            gradientText={false}
+            tag="h1"
+            className="text-5xl md:text-6xl lg:text-7xl font-bold tracking-tight text-foreground"
+          />
+          <ScrollReveal variant="slide-up" delay={0.2}>
+            <p className="text-lg md:text-xl text-muted-foreground max-w-content-width">
+              Artisan breads, pastries, and custom cakes crafted with premium ingredients. Order online or visit us today.
+            </p>
+          </ScrollReveal>
+          <ScrollReveal variant="slide-up" delay={0.3} className="flex flex-wrap gap-4 mt-4">
+            <Button text="Order Now" variant="primary" href="#products" />
+            <Button text="Our Story" variant="secondary" href="#about" />
+          </ScrollReveal>
+        </div>
+        
+        <div className="grid grid-cols-2 gap-4 relative">
+          <div className="flex flex-col gap-4">
+            <ScrollReveal variant="slide-up" delay={0.2}>
+              <div className="w-full aspect-square rounded-theme overflow-hidden shadow-sm">
+                <img src="" alt="Colorful macarons on a plate" className="w-full h-full object-cover" />
+              </div>
+            </ScrollReveal>
+            <ScrollReveal variant="slide-up" delay={0.4}>
+              <div className="w-full aspect-square rounded-theme overflow-hidden shadow-sm">
+                <img src="" alt="Baker's hands kneading fresh dough" className="w-full h-full object-cover" />
+              </div>
+            </ScrollReveal>
+            <ScrollReveal variant="slide-up" delay={0.6}>
+              <div className="w-full aspect-video rounded-theme overflow-hidden shadow-sm">
+                <img src="" alt="Assorted breakfast pastries" className="w-full h-full object-cover" />
+              </div>
+            </ScrollReveal>
+          </div>
+          <div className="flex flex-col gap-4">
+            <ScrollReveal variant="slide-up" delay={0.3}>
+              <div className="w-full aspect-video rounded-theme overflow-hidden shadow-sm">
+                <img src="" alt="Slicing a loaf of crusty bread" className="w-full h-full object-cover" />
+              </div>
+            </ScrollReveal>
+            <ScrollReveal variant="slide-up" delay={0.5}>
+              <div className="w-full aspect-square rounded-theme overflow-hidden shadow-sm">
+                <img src="" alt="Freshly baked artisan bread loaf" className="w-full h-full object-cover" />
+              </div>
+            </ScrollReveal>
+            <ScrollReveal variant="slide-up" delay={0.7}>
+              <div className="w-full aspect-square rounded-theme overflow-hidden shadow-sm">
+                <img src="" alt="Fruit tarts with fresh berries" className="w-full h-full object-cover" />
+              </div>
+            </ScrollReveal>
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}
\ No newline at end of file