Color Mania is a color guessing game based on the Great RGB Color Game designed and developed by Colt Steele in his Complete Web Developer Bootcamp. Color Mania allows users to play a simple color guessing game where they are given a color prompt in the RGB or Hex color code format and have one minute to guess at least five prompts correctly.

This project was created in association with my YouTube video, Should You Use Tutorial Projects on Your Developer Portfolio?, which discusses the importance of adding original work to a software engineer or developer portfolio. In this video, I walk through the process of using Colt Steele's RGB Color Game as the initial inspiration for my game.

Color Mania, the color guessing game, allows users to match a color prompt to a circle filled with that color, however, among circles of the correct color, there are imposters filled with an incorrect color. Players have one minute to guess at least five color prompts correctly.

When a player selects a color filled circle and it is the correct color, all game play pieces will fill with the color from the color prompt before moving to the next question. If the player does not guess correctly, the color within the circle will be removed and the player will see an outline of the shape with the color code they selected. There is no guess limit for players.

Players have the option to view their color code in two formats: RGB and Hex. They also have two game play difficulties: easy and hard. The easy difficulty (default) will fill the game board with six game pieces while the hard mode will fill the game board with nine.

This repo contains both the original version of the RGB Color Game and the reimagined Color Mania. Both can be accessed in the src/ directory.

1. Clone the repo, the navigate to the src/ directory.
2. To view the original RBG Color Game, open index.html in your browser of choice. When editing and making modifications to the original game, use classic-game.css and classic-game.js.
3. To view the reimagined Color Mania game, open redesigned-color-game.html in your browser of choice. When editing and making modifications to the reimagined game, use redesigned-game.css and redesigned-game.js.

Find links to both versions of the Color Game below:

➡️ Original RGB Color Game

➡️ Reimagined Color Mania

This project was built using: