🛒 Grocery Store Landing Page

A feature-rich grocery store landing page clone built with React, Tailwind CSS, and GSAP.
This project showcases a complex UI layout with interactive elements, smooth animations, and a modern shopping experience feel.

---

🚀 Features

• Complex Header with Tabs

  • Multiple navigation tabs with hover animations.
  • Each tab have different content.
  • Fully responsive across devices.

• Interactive Hover Animations

  • Buttons, links, and sections animate on hover.
  • Enhances overall user engagement and interactivity.

• Product Slider

  • A responsive product carousel/slider to showcase grocery items.

• Product Showcasing

  • Products displayed like real store apps, with clean visuals and organized sections.
  • Designed for a modern shopping-like experience.

• Special Offers Section

  • Highlighted deals and discounts placed on products.

• Smooth Animations

  • GSAP adds scroll-triggered and entrance animations.
  • Products and sections fade/slide beautifully into view.

• Responsive Design

  • Adapts seamlessly to desktop, tablet, and mobile screens.

---

🛠️ Tech Stack

• React.js — UI framework
• Tailwind CSS — styling & responsive layout
• GSAP — scroll + hover animations

---

📂 Usage — Setup & Run Locally

1. Clone the repo:

   git clone https://github.com/your-username/Grocery-Store-Landing-Page.git
   cd Grocery-Store-Landing-Page

2. Install dependencies:

   npm install

3. Start the development server:

   npm run dev

4. Open http://localhost:5173 (or the port shown in your terminal).

---

📬 Contact

For questions, feedback, or collaboration:

• Email: khanowaiszai@gmail.com

---

⭐ Thanks for checking out this project!