Eject cartridge
01 DOM TANK TACTICSv0.5.2 / MIT

Sherman BytesEvery page is a battlefield.

Deploy an M4-inspired pixel tank onto a live webpage. Breach fortified button bases, build your own cover, and hold the page against escalating squads.

Play uses the selected build. Notes below describe the current release.

Created by · coded.design

DOM TANK TACTICSDOM / ACTIVE SURFACE
THE PAGE ISTHE PLAYFIELD.
Breach. Build. Hold the page.ARCADE SIGNALS / DOM TERRAIN
27.0 kBgzip · complete game + engine
32enemy tank cap
120pooled shells
3buildable defenses
MEET THE CHARACTERS

Know who’s on the page.

  • Commander

    Your Sherman

    Drive with arrows or the joystick; hold Fire or Space to shoot. Mouse aiming controls the turret on desktop. Blast text into binary and capture button bases.

  • 35 armor

    Scout tank

    A lighter enemy that flanks and fires at you. Destroy it for points and two scrap.

  • 70 armor

    Heavy tank

    Joins siege waves from wave 2. Takes more damage to destroy and drops four scrap. Keep cover between you and incoming shells.

  • Builder

    Field engineer

    B builds cover, T builds a pillbox, M plants a mine. Spend scrap and leave space in front of your tank for construction.

THE LOOP
  1. 01Breach the button walls
  2. 02Capture and resupply
  3. 03Build cover and pillboxes
  4. 04Hold the next wave

Know your controls.

  • WASD/↑←↓→driveMouseaim the turret
  • Click/Spacefire; keyboard-only aiming follows the hull
  • Bcover (2 scrap)Tpillbox (8)Mmine (3)
  • PpauseGnext hostile baseEscRecall
  • Scoreboardsoundpause / resumeminimizeRecall
  • On mobilejoystick to drive, hold Fire; tap Cover, Pillbox or Mine to build

Sound starts after your first input. Minimize keeps the game running; Recall restores the page.

The terrain is the typography.

Letters block tanks and shells. Direct hits clear nearby glyphs into faint binary rubble, opening a crater wider than your tank. Whitespace becomes a route between positions. Explicit data-sherman-wall elements remain solid cover; both movement and shell rays respect their cached rectangles.

Breach the walls. Capture the button.

Four destructible wall segments surround each visible button base. Blast a gap, disable the button, and occupy it for 0.7 seconds to capture it. Friendly bases repair 18 armor per second, fire at nearby enemies, and supply one scrap every 2.5 seconds while occupied. Capturing all factories moves siege reinforcements to the page edges.

NERD NOTES · GITHUBHow Sherman Bytes works under the hoodEngineering notes, budgets and source in the README

Sherman Bytes on your site.

Shared TypeScript runtime · original single-player tank simulation

sherman-bytes.jsJS / ESM
import { createShermanBytes } from "@coded-design/sherman-bytes";

const game = createShermanBytes({
  root: "main",
  textSelector: "h1, h2, p",
  targetSelector: "button, [data-base]",
  wallSelector: "[data-sherman-wall]",
  binaryOpacity: 0.32,
  mode: "siege", // or "conquest"
  fortifications: true,
});
game.start();
// Later: game.destroy();
Choose your elements. Start playing.