A fun and interactive memory game built with HTML, CSS, and JavaScript. Flip cards to find all the matching pairs. Great for beginners looking to strengthen DOM manipulation and layout skills.
✅ HTML5
🎨 CSS3 (can include Tailwind CSS if preferred)
⚙️ JavaScript (ES6+)
- Click to flip cards and reveal hidden symbols.
- Match pairs to remove them from the board.
- Built with responsive design using Flexbox and Grid.
- Tracks the number of moves or matches (optional).
- Restart the game with a single click.
You can view the live website of the project: https://flippedmemorygame.netlify.app/
-
Clone the Repository git clone https://github.com/your-username/memory-game.git cd memory-game
-
Open in Browser You can simply open index.html in your web browser:
📜 How It Works
-
The board displays a grid of face-down cards.
-
Click on a card to flip it.
-
Flip two cards — if they match, they stay flipped.
-
If not, they flip back after a short delay.
-
Repeat until all pairs are matched!
🛠️ Customization You can customize the following:
-
Card designs/icons (using emojis, images, or SVGs).
-
Number of cards.
-
Add a timer or score counter.
-
Add animations or sound effects.
📈 Future Improvements
-
✅ Timer and scoring system
-
✅ Difficulty levels (more cards)
-
✅ Store high scores with localStorage
-
✅ Dark mode
🤝 Contributing Feel free to fork this project and add emojis and design the cards. Pull requests are welcome!