Clawd in Twenty-Nine Art Styles

Clawd, the Claude Code mascot, drawn live in twenty-nine art styles: from the cave wall to the lapel pin, and a few experiments beyond. Every line is drawn by code in your browser, with no images and no dependencies.

Unofficial fan art, built on ChetasLua's original gallery.

_{01 Cave Painting}	_{02 Black-Figure}	_{03 Heraldry}	_{04 Millefleur Tapestry}
_{05 Kamon}	_{06 Delftware}	_{07 Celestial Atlas}	_{08 Copperplate Engraving}
_{09 Chronophotography}	_{10 Art Nouveau}	_{11 Cubism}	_{12 Bauhaus}
_{13 Blueprint}	_{14 Tattoo Flash}	_{15 Mid-Century Modern}	_{16 Op Art}
_{17 Pop Art}	_{18 Pixel Art}	_{19 Contour Map}	_{20 Enamel Pin}
_{21 Atlas Glyph Tiles}	_{22 Blob Mosaic}	_{23 Phosphor Streams}	_{24 Density Portrait}
_{25 Density Field}	_{26 Teletext Page}	_{27 Maze War}	_{28 Code Poem}
_{29 Frutiger Aero}

Credits

Art styles 1–20 and the whole engine (the 3D mascot model, the rig that watches your cursor, the gallery): ChetasLua, from the original Clawd in Twenty Styles.
Art styles 21–29 (henrik-styles.js): Henrik's experiments, nine looks from an upcoming project, re-drawn around Clawd. Only the look carries over.

#	Art style	After
21	Atlas Glyph Tiles	the FT "Atlas" glyph tiles, recoloured orange on azure
22	Blob Mosaic	tile-mosaic blobs with glyph eyes on one chapter ground
23	Phosphor Streams	phosphor glyph streams that stop at once
24	Density Portrait	an ASCII density portrait made of synthetic handles
25	Density Field	ertdfgcvb (Andreas Gysin), play.core
26	Teletext Page	Goto80's Datagården
27	Maze War	Maze War on the Xerox Alto
28	Code Poem	Kerr & Holden's cold_cloud.cc: the picture is made of letters taken from its own source code
29	Frutiger Aero	the glossy jelly avatars of Frutiger Space and Frutiger Sanctuary, after mid-2000s Frutiger Aero: sky swooshes, wind turbines, soap bubbles

Running it

Open index.html through any static server. A server is needed because the page loads henrik-styles.js as a separate file:

python -m http.server 8790

Then go to http://localhost:8790.

Controls: move the pointer and they watch you · click a tile to spin it · drag to turn it · W wave · D dance · H hop · Space say cheese.

Test views: ?grid=idle&cell=200 (every art style in one pose), ?sheet=21,22&poses=idle,left,spin (a pose sheet), ?solo=epoem&pose=idle&size=800 (one big tile).

Regenerating the GIFs

With the static server running, node tools/record-gifs.mjs records every registered art style into media/ (needs Playwright and ffmpeg; set NODE_PATH=$(npm root -g) if Playwright is installed globally).

Adding an art style

Each art style is one call:

CM.style({ id, n, title, caption, init(env) { return state; }, draw(g, env, rig, state) { /* 400×400 tile */ } });

CM.build(rig.pose, view) returns the projected mascot (faces, eyes, hulls), and CM.raster(M, cols, rows) turns it into a grid of cells. The gallery shows every registered art style in order of n.

Fork it, add to it

Feel free to fork this repo and make it your own, or send a pull request with a new art style (or anything else). Every addition is welcome.

License

MIT, covering the code in this repository. The Clawd character and the Claude name belong to Anthropic; this is unofficial fan art and the license grants no rights to the character or marks.

Claude-Mascot-Style-Gallery