Type Number Guessing Game using HTML, CSS & JavaScript

Challenge your logic and luck with the Type Number Guessing Game — a simple but addictive number challenge built using HTML, CSS, and JavaScript. The computer randomly picks a number between 1 and 100. Your job? Guess the number with as few tries as possible!

🧰 Technologies Used:

• HTML5 – Input field and feedback container

• CSS3 – Responsive layout and feedback styling

• JavaScript – Generates random number, checks guesses, tracks attempts

🎮 Features:

• Random number generation (1 to 100)

• User inputs number via text field

• Real-time feedback: "Too low", "Too high", or "Correct!"

• Attempt counter

• Restart button after correct guess

• Mobile-friendly input UI

🕹️ How to Play the Type Number Guessing Game

1. The game randomly picks a number between 1 and 100.

2. You type your guess in the input box and press Enter or click Submit.

3. The game will tell you if your guess is:

   • 📉 Too Low

   • 📈 Too High

   • ✅ Correct!

4. The game tracks the number of attempts you’ve made.

5. Once guessed correctly, you can click “Play Again” to restart.

💡 Tip: Use the feedback to narrow down your next guess logically.

🧠 Learning Highlights:

• Using Math.random() and Math.floor() for number generation

• Handling user input and events (keyup, click)

• Simple conditionals for interactive feedback

• Keeping state with variables and DOM manipulation

🛠 Customization Ideas:

• Change difficulty range (e.g., 1–50 or 1–1000)

• Add a timer or countdown

• Include a leaderboard for fewest attempts

• Add hints or streak bonus system