🐍 Snake Game

A classic Snake game built with vanilla JavaScript, HTML, and CSS. Navigate the snake using arrow keys, eat the food, and try to beat your high score!

🎮 Features

• Classic Gameplay: Navigate the snake using arrow keys
• Score Tracking: Keep track of your current score and high score
• Timer: See how long you've been playing
• Persistent High Score: Your high score is saved in local storage
• Responsive UI: Clean and modern interface
• Game Over Detection: Collision detection with walls and self
• Desktop Optimized: Best experience on PC/Laptop with keyboard controls

🚀 Getting Started

Prerequisites

• A modern web browser (Chrome, Firefox, Safari, Edge)
• Desktop/Laptop for optimal keyboard controls

Installation

1. Clone the repository:

git clone https://github.com/sahilzalte/Js-Snake-Game.git

2. Navigate to the project directory:

cd Js-Snake-Game

3. Open index.html in your web browser:

# On Windows
start index.html

# On macOS
open index.html

# On Linux
xdg-open index.html

Or simply double-click the index.html file.

🎯 How to Play

1. Click "Start Game" to begin
2. Use Arrow Keys to control the snake:
   • ⬆️ Up Arrow: Move Up
   • ⬇️ Down Arrow: Move Down
   • ⬅️ Left Arrow: Move Left
   • ➡️ Right Arrow: Move Right
3. Eat the red food to grow and increase your score
4. Avoid hitting the walls or yourself
5. Try to beat your high score!

📁 Project Structure

Js-Snake-Game/
│
├── index.html          # Main HTML file
├── style.css           # Styling and CSS variables
├── script.js           # Game logic and functionality
└── README.md           # Project documentation

🛠️ Technologies Used

• HTML5: Structure and markup
• CSS3: Styling with custom properties (CSS variables)
• JavaScript (ES6): Game logic and DOM manipulation
• LocalStorage API: Persistent high score storage

🎨 Features Breakdown

CSS Variables

The project uses CSS custom properties for easy theming:

• Background colors
• Text colors
• Spacing system
• Border radius
• Border colors

Game Logic

• Grid-based rendering system
• Collision detection (walls and self)
• Food generation algorithm
• Score and timer tracking
• Local storage integration

📊 Game Stats

• High Score: Automatically saved and persists across sessions
• Current Score: Increases by 10 points for each food item consumed
• Timer: Tracks your playing time in MM-SS format

🤝 Contributing

Contributions, issues, and feature requests are welcome! Feel free to check the issues page.

1. Fork the project
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

📝 License

This project is open source and available under the MIT License.

👨‍💻 Author

Sahil Zalte

• GitHub: @sahilzalte

🙏 Acknowledgments

• Classic Snake game concept
• Inspired by the original Snake game from Nokia phones

---

⭐ If you enjoyed this game, please consider giving it a star!

Thanks for playing! ❤️