tenten

A headless, scriptable pixel-art and animation tool. Draw sprites as text grids and ops over an MCP server, a CLI or a TypeScript API, and export sheets that Phaser, Pixi and debuff load. Sprites are indexed (a palette, index 0 transparent) with layers, frames, tags and slices. There is no editing GUI. Every edit returns the frame as a text grid, so a coding agent can drive it without a screen.

The point is that the whole sprite is text. A six-line grid is a sprite, a diff shows which pixels moved, and anything that can write a string can draw. Inspired by Aseprite, not a clone of it. The .tt file is JSON with cels stored as text grids, so it reads with cat and diffs in git. Exports write PNG sheets and Aseprite-style JSON that Phaser's load.aseprite and Pixi's spritesheet parser accept, and the name@WxH.png strips debuff's asset compiler reads.

Part of debuff, the toolkit for 2D browser games. Projects made with npm create debuff list tenten in their .mcp.json, and the tenten() plugin in @debuffjp/cli turns .tt files in assets/ into sprite sheets, fetching tenten with npx when it is not installed.

MCP server

{ "mcpServers": { "tenten": { "command": "npx", "args": ["-y", "-p", "@debuffjp/tenten", "tenten-mcp"] } } }

Or from a checkout: node bin/tenten-mcp.js. Twelve tools: tt_new, tt_open, tt_save, tt_describe, tt_draw, tt_undo, tt_render, tt_diff, tt_export, tt_watch, tt_preview, tt_palettes. A sprite is usually one tt_draw call with a grid op:

{ "ops": [
  { "op": "grid", "rows": ["..0000..", ".011110.", "01122110", "01111110", ".011110.", "..3..3.."] },
  { "op": "outline", "c": 4 },
  { "op": "addFrame" }, { "op": "shift", "dx": 0, "dy": 1, "frame": 1 },
  { "op": "tag", "name": "idle", "from": 0, "to": 1 }
] }

In a grid . is transparent and 0-9a-zA-Z are palette indices 1 to 61, so index 1 is drawn as 0. tt_describe lists each palette entry with its grid character, as 1=#ffd700 (0). tt_render with view: "png" draws every frame zoomed with its index under it. tt_diff lists the pixels that differ between two frames or two documents.

tt_preview opens a small page for the human that shows every open document zoomed and plays its animations, updated on every change:

Related MCP server: Pixel Art AI

.aseprite

Reads RGBA, grayscale and indexed files with raw, compressed or linked cels at any offset, and writes indexed files with a palette, layers, tags and slices. The tests render Overbuffed's Aseprite files to the PNGs Aseprite exported from them, pixel for pixel, and, when Aseprite is installed, have the real binary open a tenten-written file and export the same sheet. The codec is written from the published file spec, not from Aseprite's source.

CLI

tenten show <file> [--frame n]
tenten info <file>
tenten export <file> [--out dir] [--layout horizontal|vertical|grid] [--scale n] [--padding n] [--frames] [--debuff] [--aseprite]
tenten preview <file> [--out file.png] [--scale n]
tenten convert <file> <out>

<file> is .tt or .aseprite.

Library

import { Editor, save, sheet } from "@debuffjp/tenten";
const e = Editor.create("coin", 8, 8);
e.batch([{ op: "palette", colours: ["#ffd700", "#b8860b"] }, { op: "ellipse", x: 0, y: 0, w: 8, h: 8, c: 1, fill: true }]);
await save(e.doc, "coin.tt");

Ops: grid, pixel, line, rect, ellipse, diamond (a 2:1 isometric footprint), flood, outline, shift, flip, replace, copy, clear, addLayer, removeLayer, addFrame, removeFrame, duration, tag, untag, slice, unslice, colour, palette. A batch is one undo step and rolls back whole if an op fails.

Not yet

Tilemap layers and tilemap cels in .aseprite, brushes, in-place texture swapping without a reload (today tt_watch rewrites files and the dev server reloads). Node 24 runs the TypeScript source directly; npm run check typechecks and runs the tests.