/ilovehue

A vanilla JS clone of the mobile game I Love Hue

Primary LanguageJavaScript

I Love Hue

Handmade with love by Neil Italia

Live Demo   |   Trello Board   |   Connect with me on LinkedIn!


📝 About

This is a peaceful game of sorting colors. The main goal of the game is to sort an entire grid of colors based on hue, saturation, and lightness values. This is a clone of a popular mobile game also called "I Love Hue", recreated with HTML, CSS and vanilla JavaScript.

Tech Stack

                                          

🕹 Game Modes

You can play a 3x3 puzzle (Easy), a 6x6 puzzle (Advanced), or a full 9x9 puzzle (Expert). After completing a puzzle and sorting colors, you score increases depending on how many tiles are present: +9 for easy puzzles, +36 for advanced puzzles, +81 for expert puzzles. Your score increases the more boards you complete!

📸 Screenshots

      

🚦 Getting Started

Visit the live demo hosted on Surge, read through the initial prompt for your name and if you want to accept cookies for this game. At the start of every game, you see a completed puzzle. The game shuffles the board then you can go and sort! An instructions page is accessible from anywhere in the game in case you need it again. If the game is too bright, you can turn on dark mode with the button in the center.

🏗 Thought Process

    

Future Updates

  • Dark Mode
  • Pull colors from an external API
  • Interpolate any number of colors given only 2 colors
  • Dynamically generate puzzles
  • Hexagonal grids

📢 Shoutouts

The Original Game

Cookies & Expiration dates

Array Destructuring

Windows Color Picker

CSS Only Tooltip

Sortable

Queries from URLs

Dark Mode