Responsive Product Card

Responsive Product Card using HTML, CSS, and JavaScript.

➥ Live Demo

Desktop Preview

product-card.mp4

Prerequisites

Before you begin, ensure you have met the following requirements:

• You Should Know Basic or Intermediate of HTML ,CSS and JavaScript

Bootstrap Icon

<!-- Bootstrap Icon -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">

Project Contain

• Product Image
• Product Size
• Product color
• Add to Cart Button
• Badge
• Fully Responsive for all devices

Font Family

• I have Used Google Fonts - Poppins

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">

Run Locally

To run Product Card locally, run this command on your git bash:

Linux and macOS:

sudo git clone https://github.com/pawantech12/product-card.git

Windows:

git clone https://github.com/pawantech12/product-card.git

Contact

If you want to contact with me you can reach me at Instagram.

License

This project is Free To Use and does not contains any license.