Play

A quick Snake game in your browser.

Built the same way I build lab tools: simple, self-contained, and running entirely in your browser. Use it as a break between labs or as a starter example for canvas-based games.

Snake (grid-based)

Use the arrow keys or WASD to move. Eat the blue food blocks to grow. Hitting a wall or your own tail will reset the game.

Score: 0 Speed: Normal

All logic runs locally in this tab. If you want to see how it works, scroll down to the inline script and follow the comments.

How this game is wired

This page keeps the same layout, typography, and color system as the rest of the site. Under the hood, the game uses:

  • A fixed-size grid mapped to canvas pixels.
  • A simple game loop using setTimeout for timing.
  • Keyboard listeners for arrow keys and WASD, with direction safeties (no instant 180° turns).
  • Score and speed labels that update as the snake eats more food.

If you ever want to extend this, ideas include: pause/resume, walls that appear over time, or multiple speed presets.