Snake Game

This is a classic Snake game built using HTML, CSS, and JavaScript, featuring an enhanced user interface and dynamic speed adjustments.

---

Features

• Classic Snake Gameplay: Control a snake to eat food and grow, avoiding collisions with walls or its own body.
• Enhanced UI:
  • Grid-based Play Area: A clearly defined grid helps with spatial awareness.
  • Distinct Colors: Different colors for the snake's head and body, food, and background for better visual clarity.
  • Score Display: Real-time score tracking visible on the screen.
  • Game Over Screen: A clear "Game Over!" message with your final score.
  • Restart Option: A dedicated button to easily restart the game.
• Dynamic Difficulty: The game speed increases progressively as you score more points, making it more challenging over time.

---

How to Play

1. Open index.html: Simply open the index.html file in your web browser (like Chrome, Firefox, Edge, etc.).
2. Controls: Use the Arrow Keys (Up, Down, Left, Right) on your keyboard to change the snake's direction.
3. Objective: Guide the snake to eat the red food. Each time the snake eats, it grows longer, and your score increases.
4. Game Over: The game ends if the snake hits a wall or collides with its own body.
5. Restart: Click the "Restart Game" button to play again.

---

Project Structure

• index.html: The main HTML file that sets up the game's webpage structure, including the canvas element, score display, and restart button.
• style.css: Contains all the CSS rules for styling the game, ensuring a visually appealing and user-friendly interface.
• script.js: The core JavaScript file that handles all the game logic, including:
  • Snake movement and growth.
  • Food generation.
  • Collision detection.
  • Score management.
  • Dynamic speed adjustment based on score.
  • Rendering the game on the HTML canvas.

---

Customization

You can easily modify various aspects of the game by editing the script.js and style.css files:

• Game Speed: Adjust gameSpeed, SPEED_INCREMENT_FACTOR, and MIN_SPEED in script.js to change the initial speed, how much it increases, and the maximum speed.
• Colors: Change the color hexadecimal codes in style.css and script.js (e.g., WHITE, BLACK, GREEN, RED, etc.) to customize the game's appearance.
• Grid Size: Modify GRID_SIZE in script.js to change the size of each tile (note: this might also require adjusting CANVAS_SIZE for optimal display).
• Canvas Dimensions: Alter the width and height attributes of the <canvas> tag in index.html and the CANVAS_SIZE constant in script.js.

---

Technologies Used

• HTML5: For structuring the game's web page.
• CSS3: For styling and visual presentation.
• JavaScript: For implementing all game logic and interactivity.

---

Author

Harsha41-dev

---