Hey everyone!👋
I'm excited to share my latest project: Simon Says JS — a colorful memory game built using pure HTML, CSS, and JavaScript. 🎨🧠
In this post, I'll walk you through the project overview, key features, and how you can try it out!
Project Overview
The Simon Says game is a classic memory challenge where you need to repeat an increasingly long sequence of colors correctly.
I built a modern, mobile-responsive version from scratch to sharpen my front-end skills like:
- DOM manipulation
- Event handling
- CSS animations
- Game logic building
Live Demo:
Source Code:
🛠️ Features
- 🎨 Colorful animated buttons
- 📈 Dynamic level progression
- 🔊 Button click sounds and Game Over sounds
- 🏆 High score tracking with LocalStorage
- 📱 Fully mobile responsive
- ✨ Smooth transitions and UI animations
- 🖥️ Clean design with modern fonts and gradient backgrounds
🎮 How to Play
- Press the Start button to begin the game.
- Watch carefully as the game flashes a random color.
- Click the colored buttons in the same sequence shown.
- Each new level adds one more color to the sequence.
- If you make a mistake, it's Game Over — your score and High Score will be displayed.
- Press Start again to try and beat your High Score! 🏆
📸 Sneak Peek (Screenshots)
Desktop View:
Mobile View:
📂 Tech Stack Used
- HTML5 — for structure
- CSS3 — for styles, responsive layout, transitions
- JavaScript (Vanilla) — for game logic and user interaction
- Google Fonts — for modern typography
- LocalStorage API — to save High Scores
✨ Challenges and Learning Points
- Handling real-time event listening for multiple buttons
- Managing sequence arrays and checking user input dynamically
- Adding smooth CSS transitions for better UX
- Working with LocalStorage to persist data across browser sessions
- Making the page fully responsive for mobile screens
🚀 Future Improvements
- 🎮 Add difficulty levels (Easy, Medium, Hard)
- 🔊 Add background music with mute/unmute button
- 🏆 Create a leaderboard system
- 📱 Make it a Progressive Web App (PWA) for offline play
- ✨ Add new bonus game modes like "Reverse Simon"
🙌 Final Thoughts
Building Simon Says JS was a great way to practice and apply front-end skills, especially DOM manipulation and game logic.
I'm really proud of how polished and mobile-friendly it turned out!
I'd love your feedback and ideas for future upgrades! 🚀
If you like it, feel free to ⭐ the GitHub repo!
Thanks for reading! 🙏
🚀 Challenge your memory now: Play Simon Says JS!
Top comments (0)