Memory Card Game

A simple, interactive Memory Card Game built with HTML, CSS, and Vanilla JavaScript. The objective of the game is to match pairs of cards with the same color.

Features

• Interactive Gameplay: Click on cards to flip them and reveal their colors.
• Match Logic: The game checks if two flipped cards match. If they do, they stay flipped; otherwise, they flip back after a short delay.
• Win Condition: Once all 8 pairs (16 cards) are matched, a congratulatory message is displayed.
• Responsive Design: The game layout adapts to both desktop and mobile screens for a seamless experience.
• Restart Functionality: A "New Game" button allows players to instantly reset the board, shuffle the colors, and start over at any time.

Technologies Used

• HTML5: For the basic structure of the game board and cards.
• CSS3: For styling, responsive design (Flexbox and Grid), and 3D flip animations using transform properties.
• JavaScript: For the game logic, DOM manipulation, handling click events, randomizing card colors, and checking for matches.

Screenshots

Starting Page

Playing Screen

Winning Screen

How to Play

1. Clone or download this repository.
2. Open the index.html file in any modern web browser.
3. Click on any card to flip it and reveal its hidden color.
4. Click on a second card to try and find a match.
5. If the colors match, the cards will remain face up.
6. If they don't match, the cards will flip back over after a brief delay.
7. Continue flipping cards until you have successfully matched all pairs to win the game.
8. Click the "New Game" button to shuffle the cards and play again.

Author

Made by Gopal Kundu