🛍️ Animated Product Card

A visually engaging and animated product card built with HTML, CSS, and JavaScript. This interactive component is ideal for showcasing items in e-commerce websites or product portfolios.

🎯 Features

• 🌀 Smooth hover animations and transitions
• 🖼️ Product image zoom effect
• 📝 Product name, description, and price
• 🛒 "Add to Cart" styled button (non-functional)
• 📱 Fully responsive and mobile-friendly design

💡 Technologies Used

• HTML5
• CSS3 (Animations, Transforms, Flexbox)
• JavaScript (Optional interactivity)

🚀 Getting Started

1. Clone the Repository

git clone https://github.com/viktor-rumiievskyi/Animated-Product-Card.git
cd Animated-Product-Card

2. Open in Browser

Just open index.html in your browser.

Optional: Use a Local Server

# Example using Python 3
python -m http.server

Then go to http://localhost:8000 in your browser.

📁 Project Structure

Animated-Product-Card/
│
├── index.html       # Markup for the product card
├── style.css        # Animations and styling
├── script.js        # Optional JavaScript logic
└── README.md        # Project documentation

🌟 Potential Enhancements

• 🔄 Flip animation for more product info
• 🧠 Integration with shopping cart system
• 🌙 Light/Dark mode toggle
• ✨ Add more cards in a grid layout
• 🧪 Use frameworks like React or Vue for reusable components

👨‍💻 Author

Viktor Rumiievskyi

• GitHub: @viktor-rumiievskyi

📄 License

This project is licensed under the MIT License.

---