Space Invaders

A browser-based Space Invaders clone where every pixel of art was written as code — no Photoshop, no sprite packs.

Play it →

Controls

Key	Action
← / → or A / D	Move
Space	Fire
Esc	Pause / Resume

---

How the art was made

Sprites — pixlrt

All 17 sprites (aliens, cannon, UFO, shields, bullets, explosion) are defined as ASCII grids mapped to a PICO-8 palette, then packed into a single atlas PNG + JSON at build time via pixlrt.

// scripts/gen-sprites.ts
const alien_a_0 = sprite({
  name: 'alien_a_0',
  palette: {
    '.': [0, 0, 0, 0],
    'G': [0, 228, 54, 255],
    'g': [0, 135, 81, 255],
  },
  frames: [
    '.GG..GG.\n' +
    'GGGGGGGG\n' +
    'GgGGGGgG\n' +
    'GGGGGGGG\n' +
    '.GGGGGG.\n' +
    'G.G..G.G\n' +
    '..G..G..\n' +
    '.G....G.',
  ],
});

toAtlas(allSprites, 'public/sprites.png', { padding: 1 });
// → public/sprites.png + public/sprites.json

Background — pxlator

The background is a 224×256 PNG processed through pxlator — drag your image into pxlator, set the palette to PICO-8 and dither to Atkinson, download, and drop the result into public/bg.png. The game loads it at startup and falls back to a solid dark navy if it's missing.

---

Development

npm install
npm run gen:sprites   # pixlrt → public/sprites.png + sprites.json
npm run dev           # gen + vite dev server
npm run build         # gen + vite build

Deployment

Pushes to main automatically deploy to GitHub Pages via the included workflow.

To enable: go to Settings → Pages → Source and set to GitHub Actions.

Game features

• 5×11 alien grid — squid (10 pts), crab (20 pts), octopus (30 pts)
• Grid speeds up as aliens die and across waves
• 4 destructible shields with 4 damage stages
• UFO bonus ship every ~25 s (50–300 pts, random)
• 3 lives · extra life at 1500 pts
• Persistent hi-score via localStorage