berylrb / colorguesser

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Do you know Roy G Biv?

There are 141 named CSS colors -- how good are you at identifying them?

If you want to test yourself in a timed environment, click start timer. Otherwise, click a category to get started. The paint swatch will display an unidentified color -- guess the name with the buttons below the paint swatch. If you're right, you'll hear a chime and your score will increase. If you're wrong, you'll hear a buzzer and no point. The game ends when you've guessed all 141 colors.

NOTE: You may be saying, "I heard there were 147 CSS color names!" Well, yes. There are 147 color NAMES but there are actually only 139 colors.

8 colors have duplicate names -- Aqua/Cyan, Fuschia/Magenta, DarkGrey/DarkGray, Gray/Grey, DimGrey/DimGray, LightSlateGrey/LightSlateGray, SlateGrey/SlateGray, and DarkSlateGrey/DarkSlateGray.

I included both aqua/cyan and fuschia/magenta but not the duplicate grays.

Getting Started

https://name-these-colors.netlify.app/

Screenshot of wireframe

Screenshots

Screenshot of unplayed color guesser Screenshot of color guesser midway through game

Technologies Used

Javascript, HTML, CSS

Next Steps

Thanks to

Color icons created by Soodesign - Flaticon

https://htmlcolorcodes.com/color-names/

https://www.designcise.com/web/tutorial/how-to-check-if-an-array-contains-all-elements-of-another-array-in-javascript

About


Languages

Language:JavaScript 64.8%Language:CSS 20.1%Language:HTML 15.1%