SameGame (NacatamalOn version) + source code

Click a group of two or more adjacent tiles of the same color to remove them. Gravity pulls the remaining tiles down, empty columns collapse to the left, and the board keeps shrinking until nothing can be matched.

Scoring

Bigger groups are worth disproportionately more: removing n tiles scores n × (n − 1), multiplied by your current level. Clearing four tiles four times gives you 48 points. Clearing sixteen at once gives you 240. Patience pays.

Your best score is stored locally in your browser.

How to play

• Click or tap a group of two or more matching tiles
• Single tiles can't be removed
• Run out of moves with tiles left on the board and the game restarts
• Empty the board completely and you level up
• Press C to switch the CRT effect off and on
• Press D to switch the dithering off and on

The 1997 look

Every frame goes through two screen effects, both built into NacatamalOn. First, each color channel is cut down to the 8 levels of the Sega Mega Drive's 9-bit palette, with an ordered dither hiding the steps: watch the sky behind the board break into bands, and the tiles turn into a checkered pattern as they fade out. Then the result is drawn on a slightly curved CRT tube, with scanlines and a soft glow.

Turn both effects off with C and D to see the plain picture underneath, then turn them back on. Or play the Phaser 4 version, with high resolution art, to compare the two.

Under the hood

The game logic lives in a headless TypeScript class that knows nothing about rendering. It only tracks tile types, computes the regions to remove, and returns the resulting changes: what was removed, what fell, what shifted. NacatamalOn takes that list and turns it into tweens.

This is the same engine, unchanged, that powers the Phaser 4 version of this game. Only the scene was rewritten, which is exactly what a headless engine is for.

NacatamalOn is a young 2D and 3D web engine built for the look of the consoles from the SNES to the GameCube. It runs on WebGPU with a WebGL2 fallback, scenes are plain functions, and state comes from hooks. Palette reduction, dithering and CRT effects are built in.

There isn't a single image file in the game: tiles, sky and even the favicon are painted in code, pixel by pixel.

Source code

The complete project is available for download above: the NacatamalOn scene, the SameGame engine, the functions that paint the art, the Vite setup and a README that walks you through all of it.

Good starting point if you want to change the tile art, the board size or the gravity direction, try another console's color depth or CRT preset, or reuse the engine with a renderer of your own.

• Engine source and docs: samegame-engine on GitHub
• The same game in Phaser 4: play it on itch.io
• How the Phaser 4 version was built: read the tutorial
• NacatamalOn docs, tutorial and examples: nacatamalon.com

Font: Nacatamal Arcade, built into NacatamalOn, derived from Press Start 2P, SIL Open Font License 1.1.

Built with NacatamalOn, TypeScript and Vite.