This Fully Responsive game incorporates Model–View–Controller Pattern on the backend. The implementation only uses HTML5, CSS3 & JavaScript. CSS Animations are used for background lighting.

Player must find the two matching cards. The way to win the game is to click on the two matching cards back to back. Cards are sorted randomly at the beginning of each game and there is only two matching cards per game. When a card is clicked, only that card is revealed while others are hidden. Every click by the player on a card is counted as a 'move' and the number of 'Total Moves' by the player is displayed at top of the page. Once the player has found the two matching cards, an Alert will display the total number of moves it took for the player to finish the game and the game will reset.

This game will test the player's memory. There are 6 cards displayed in each game but the pictures on those 6 cards are chosen randomly from 10 different pictures.

The player can turn on/off the background light animation using the 'Toggle Light Animation' button.

JavaScript HTML5 CSS3 CSS Animations Flexbox GIT Github Pages