🌱 Virtual Herbal Garden 🌿

Explore the Virtual Herbal Garden online: Virtual Herbal Garden

A web-based project that provides an immersive experience to explore the beauty and benefits of medicinal plants. The Virtual Herbal Garden enables users to navigate through an interactive interface, view detailed plant information, and learn about their medicinal and cultural significance.

---

📌 Features

• Interactive Landing Page: Engaging animations and a welcoming entry into the herbal garden.
• Explore Plants: Browse a comprehensive list of medicinal plants with an image gallery.
• Detailed Information: Individual pages for each plant, showcasing its medicinal uses, seasonal growth, cultural significance, and more.
• Smooth Animations: Powered by GSAP for visually appealing transitions and effects.
• Responsive Design: Fully responsive CSS ensures an optimal user experience on different devices.
• Deployed Online: Accessible at Virtual Herbal Garden.

---

🏗️ Project Structure

The project is divided into well-organized folders for maintainability and scalability.

  📁 Virtual-Herbal-Garden
  ├── 📁 assets
  │   ├── 📁 css
  │   │   ├── style.css
  │   │   ├── plants.css
  │   │   └── third-page.css
  │   ├── 📁 images
  │   │   ├── intro-slide-img-1.jpg
  │   │   ├── aloe-vera.jpg
  │   │   ├── neem.jpg
  │   │   └── ...
  │   └── 📁 js
  │       ├── index.js
  │       └── plants.js
  ├── 📁 plants-details
  │   ├── aloe-vera.html
  │   ├── neem.html
  │   └── ...
  ├── index.html
  ├── plants.html
  └── README.md

---

📖 Project Overview

The Virtual Herbal Garden is designed to educate and inspire users about the benefits and cultural significance of medicinal plants. Key highlights include:

• A visually appealing landing page introducing users to the project.
• A detailed catalog of medicinal plants, complete with scientific names and high-quality images.
• Individual plant pages showcasing medicinal uses, cultural relevance, and growth habits.

This project is ideal for anyone interested in herbal medicine, biodiversity, or sustainable gardening.

---

🛠️ Tech Stack

The Virtual Herbal Garden project uses a modern and efficient tech stack to create a visually appealing, responsive, and interactive web experience:

Frontend

• HTML5: Structure of web pages.
• CSS3: Styling, layouts, and responsive design.
• JavaScript (Vanilla JS): Interactivity and animations.

Animation Library

• GSAP (GreenSock Animation Platform): Smooth and professional-grade animations for transitions and effects.

Hosting Platform

• Vercel: Deployment and hosting.

Design Assets

• Images: High-quality visuals for plants and backgrounds stored in the assets/images folder.

Development Tools

• Code Editor: Visual Studio Code (or any preferred editor).
• Version Control: Git and GitHub for code management and collaboration.

---

🌐 Live Demo

Explore the Virtual Herbal Garden online: Virtual Herbal Garden

---

License

This project is licensed under the MIT License - see the LICENSE file for details.