Product Landing Page using HTML, CSS & JavaScript

A visually appealing product landing page built using HTML, CSS, and JavaScript, featuring smooth and modern animations powered by GSAP (GreenSock Animation Platform).

---

📺 Demo & Tutorial

🎥 Watch the full build on YouTube:
Product Landing Page Tutorial

---

🖼️ Preview

---

🚀 Features

• Responsive and clean product landing page design
• Modern UI/UX layout
• Smooth animations using GSAP
• Structured and beginner-friendly code
• Uses Flexbox and CSS Grid for layout

---

🛠️ Technologies Used

• HTML5 – Page structure
• CSS3 – Styling, layout, and responsiveness
  • Flexbox
  • Grid
  • :nth-child selector
  • ::before & ::after pseudo-elements
• JavaScript – Interactivity and animations
• GSAP – High-performance animations

---

📂 Project Structure

Product-landing-page-using-html-css-javascript/
│
├── index.html        # Main HTML file
├── style.css         # CSS styles
├── js/               # JavaScript & GSAP animations
├── shoe_img/         # Product images
├── logo.png          # Logo asset
└── README.md         # Project documentation

---

💡 Learning Outcomes

By working on this project, you will learn:

• How to design a real-world landing page
• How to use Flexbox and Grid together
• How to add professional animations with GSAP
• How to structure a frontend project properly

---

📌 How to Use

1. Clone the repository:

   git clone https://github.com/ananikets18/Product-landing-page-using-html-css-javascript.git
   

2. Open index.html in your browser
3. Explore and customize the design

---

🙌 Credits

Created by Code Savvy Don’t forget to ⭐ the repository if you found it helpful!