Hex Hunter - Color Perception Puzzle Game
Can your eyes detect #FF5733 from #FF5734? This color perception game challenges you to find the subtly different colored square in a grid. Start easy with obvious differences, but by level 20, the contrast becomes nearly invisible. Perfect for designers testing their color accuracy, developers learning hex codes, or anyone curious about their visual perception. Free, browser-based, surprisingly hard. You will start noticing tiny color differences in real UI work, from gradient banding to one-digit hex typos. It is built for quick sessions: clear rules, responsive controls, and smooth performance on desktop and mobile. Play a round, share your score, and jump back in without installs or accounts. Built for speed, clarity, and repeat use.
Level
1
Score
0
Time
10
Ready to test your color perception?
• Find the different colored square
• 10 seconds per level
• Difficulty increases each level
Game Over!
Final Score
0
Highest Level
1
Color Perception Rating
Share your score:
High Score:
0
How to Play Hex Hunter
- Select and review: Find the odd square - One square has a slightly different color. Use the input panel and result panel to confirm output.
- Click it quickly - Timer counts down, faster clicks = bonus points. Use the input panel and result panel to confirm output.
- Select and review: Progress through levels - Grid gets larger, colors get closer. Use the input panel and result panel to confirm output.
- Select and review: Beat your high score - Share results to challenge friends
The Science of Color Perception
Human color perception varies widely. Most people can distinguish about 1 million colors, but trained designers/artists can perceive finer gradations. This game uses HSL color space and decreases the hue difference by 1-2 degrees each level: hsl(180, 50%, 50%) vs hsl(182, 50%, 50%).
Why this is hard: Context affects perception. The same color looks different on different backgrounds (simultaneous contrast). Also, blue/green discrimination is harder than red/yellow because our eyes have fewer blue cones. Designers use this principle when choosing accessible color palettes.
Pro tip: Squint or blur your eyes slightly - different colors will 'pop' more than similar ones. This game is secretly training you for real design work: choosing accessible color contrasts, detecting color banding in gradients, or debugging CSS color values. High scores require color-critical monitors, not just good eyesight.