Inspiration
Inspired by the classic "Hot and Cold" guessing game, we wanted to create a daily challenge that combines logic, visual perception, and a bit of luck. After considering words and numbers, we settled on colors—a universal yet surprisingly tricky medium that tests your eye for detail.
What it does
Guess the Hue is a daily color-matching challenge where players try to recreate a randomly selected RGB color. Each day presents a new target color, and players adjust red, green, and blue sliders (0-255) to match it as closely as possible. The game provides accuracy feedback after each attempt, and channels that are guessed correctly get locked in place. Compete with others on the leaderboard to see who can match the color in the fewest attempts!
- Daily Challenges: New target color every day
- RGB Slider Controls: Fine-tune each color channel (0-255)
- Real-time Preview: See your color mix instantly
- Locking System: Correct channels lock automatically
- Leaderboard: Compete with other players
- Celebration Animations: Confetti and effects when you win!
Features
🎯 Core Gameplay
- Adjust RGB sliders to match the target color
- Real-time color preview and accuracy display
- Channel locking system for correct values
- Daily challenge with new colors
🏆 Hinting System
- 90-100%: Excellent (Green badge)
- 70-89%: Good (Yellow badge)
- 0-69%: Keep Trying (Red badge)
Tech Stack
- Devvit: Reddit's developer platform for immersive games
- React: UI framework with hooks and state management
- Vite: Fast build tool and development server
- Express: Backend API server
- Tailwind CSS: Utility-first CSS framework
- TypeScript: Type-safe JavaScript
- Glassmorphism Design: Modern UI with frosted glass effects
Challenges we ran into
- Color perception: Translating pixel-perfect color matching into an engaging game mechanic required careful UX design
- State synchronization: Managing game state across frontend hooks and backend APIs while preventing race conditions
- Devvit learning curve: Adapting to Reddit's platform-specific APIs and constraints
Accomplishments that we're proud of
- Intuitive, visually appealing UI: works seamlessly on mobile and desktop
- Robust backend: handles concurrent users and accurately calculates color similarity
- Confetti Animation: Colorful confetti falls when you win
- Floating Particles: Celebration emojis float across the screen
- Bounce-in Effect: Smooth entrance animation for celebration modal
- Spinning Trophy: Animated trophy icon
- Pulsing Text: "Perfect Match!" text pulses to draw attention
- Successfully integrated with Reddit's ecosystem using Devvit
- Designed a channel-locking mechanism that adds strategic depth to the gameplay
What we learned
- Deep dive into React hooks and custom hook patterns for state management
- Color theory and RGB distance calculations (Euclidean vs perceptual color spaces)
- Reddit Devvit platform architecture and best practices
- Effective Git collaboration workflows for rapid prototyping
What's next for Guess the Hue
- Social features: Share results
- Difficulty modes: Easy (larger color tolerance), Hard (stricter matching), Colorblind-friendly modes
- Achievements: Unlock badges for streaks, perfect matches, and community milestones
- Analytics: Personal stats tracking (average attempts, win rate, favorite colors)
- Practice Mode: (Disabled button with "Soon" indicator)
Built With
- devvit
- express.js
- javascript
- react
- redis
- tailwind
- typescript
- vite
Log in or sign up for Devpost to join the conversation.