Skip to content
Content
Skill

/codeart2d

Explicit-only last resort. Draws game art from code, with no image model - pixel sprites from a PixelSpec, flat vector props, UI and icons from portable SVG, rigged characters with planted feet, FX with a JS runtime, seam-proven autotiles, playable top-down layouts with

BOOST
From plugin
agent-sprite-forge
4.3k5 skills
Install
$ npx -y skills add 0x0funky/agent-sprite-forge --skill codeart2d --agent claude-code

How it fires

How this skill gets triggered: by you, by Claude, or both.

  • Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
  • You can call itInvoke it directly when you want it.
  • Slash command/codeart2d

Context preview

The summary Claude sees to decide when to auto-load this skill.

Explicit-only last resort. Draws game art from code, with no image model - pixel sprites from a PixelSpec, flat vector props, UI and icons from portable SVG, rigged characters with planted feet, FX with a JS runtime, seam-proven autotiles, playable top-down layouts with

SKILL.md

codeart2d.SKILL.md
name: codeart2d
description: Explicit-only last resort. Draws game art from code, with no image model - pixel sprites from a PixelSpec, flat vector props, UI and icons from portable SVG, rigged characters with planted feet, FX with a JS runtime, seam-proven autotiles, playable top-down layouts with collision, stylized parallax and ambient plate motion - palette-exact, with QA and review sheets. Use only when the user explicitly asks for code-drawn art, or when generate2dmedia route_media.py finds no image or video route (no-route, exit 3). Never the default - image generation (generate2dsprite, generate2dmap, video2dsprite) comes first for characters, props, maps and FX. Not for painterly, detailed or likeness art, HD-2D plates or realistic fire, smoke or water. Always disclose the result as code-drawn.

Code Art 2D

You write the art as text (PixelSpec JSON, portable SVG, rig, FX, material, layout or parallax specs); the scripts render, check and package it. No image model is involved. It is a declared art source (`art_source: "code"`), not a placeholder.

Use when

  • The user explicitly asks for code-drawn art: a PixelSpec or SVG sprite, palette variants drawn in code, a code rig, code FX, a seam-proven autotile set, a code-made layout, stylized parallax or ambient loops.
  • `route_media.py` prints `no-route` (exit 3): no API key is configured and no local image or video route exists. Say so, and offer to add a key or a CLI as well.
  • Pose and layout guides that help an image model (support material, not final art).

Do not use when

  • Any art request while an image or video route exists and the user did not ask for code art: [generate2dsprite](../generate2dsprite/SKILL.md), [generate2dmap](../generate2dmap/SKILL.md) or [video2dsprite](../video2dsprite/SKILL.md) generate it.
  • Painterly, organic or identity-rich art, likenesses, portraits, HD-2D plates or textured terrain; realistic fire, smoke or water.
  • Never trace licensed characters into specs.

Capability check (once per session)

Run `python "<skill-dir>/../generate2dmedia/scripts/route_media.py" resolve --kind image` (or `--kind video`): when it names a route, the image or video skill takes the request unless the user asked for code art. `forge_doctor.py` in the same folder shows the full picture. If `encoding.stdout` fails, set `PYTHONUTF8=1`. For SVG work also run `svg_render.py doctor --report <new.json>` once per machine.

Art source

This skill is the explicit-only last resort of the route order: the API when a key is configured, then the local image tools, then code art, only when the user asks for it or no route exists. Never substitute it silently for generated art. Before you draw, check what code art can and cannot draw well in [style-envelope.md](references/style-envelope.md) (its table describes strengths, not the route order), and tell the user when a request needs an image model. Disclose every result: "code-drawn, no image model" (`codeart-meta.json` records `"art_source": "code"`); never present it as image-model output.

Host notes

  • **Codex:** this skill is explicit-only; `image_gen` and `route_media.py` make the art unless the user asks for code art. Look at review sheets with `view_image`.
  • **Claude Code:** use it only on request or after `no-route`. Look at every `preview-*.png` and `review/*.png` with Read before you report; run tools with Bash; `<skill-dir>` is `${CLAUDE_SKILL_DIR}`.
  • **Grok:** runs the same Python tools; its native image tools make the art unless the user asks for code art.

Commands

Run each tool as one line from the user's project root: `python "<skill-dir>/scripts/<tool>.py" ...`. `<skill-dir>` is this skill's folder; sibling skills sit beside it (`--build-clips` calls `<skill-dir>/../generate2dsprite/scripts/build_animation_clips.py`). Keep specs and outputs inside the project. Every tool writes a new `--output-dir`: it refuses an existing one and publishes only a complete result; with `--strict-qc` a failed check publishes nothing. Success prints one JSON line; errors print `error: ...` and exit 1; usage errors exit 2. Examples to copy: `examples/`.

Dependencies: numpy and Pillow for everything; PixelSpec rendering and `pixel_qa.py` need nothing else. SVG art also needs one rasterizer: resvg-py (`python -m pip install "resvg-py>=0.5,<0.6"`, preferred), the resvg-js CLI on PATH, or Chrome/Edge (set `CHROME_PATH`) ([rasterizers.md](references/rasterizers.md)). Never PyMuPDF, skia-python or cairosvg: they silently ignore crispEdges, `<style>`, clipPath or gradients. `fx_verify.mjs` needs node.

Hello sprite

1. Write `gem.pixelspec.json` (the "Hello sprite" block in [pixelspec.md](references/pixelspec.md)). 2. `python "<skill-dir>/scripts/render_pixelspec.py" --spec gem.pixelspec.json --output-dir out/gem-v1 --preview-scale 8 --strict-qc` 3. Open `out/gem-v1/preview-x8.png`; the frames are in `out/gem-v1/<variant>/frames/`. 4. Tell the user it is code-drawn (no image model).

Pipeline

| Need | Route | |---|---| | Pixel character, prop or FX with palette variants | PixelSpec ([pixelspec.md](references/pixelspec.md)), then `render_pixelspec.py --spec <spec> --output-dir <new> --build-clips --strict-qc`; review with `pixel_qa.py` | | Flat vector character, prop, UI or icon set | portable SVG with palette classes ([svg-profile.md](references/svg-profile.md)), then `svg_render.py render --svg <svg> --palette <palette.json> --output-dir <new> --zoom N` | | Crisp pixel art drawn with SVG shapes | `svg_render.py render --crisp --zoom N --strict-qc` | | Check an SVG before rendering | `svg_render.py lint --svg <svg> --profile portable` (add `--compile --palette <p>`) | | Small character that walks, idles or attacks with planted feet | rig SVG plus a `rig_anim.v1` file ([rig-animation.md](references/rig-animation.md)), then `rig_animate.py --rig <svg> --anim <json> --output-dir <new> --build-clips --strict-qc`; look at `review/*.png` | | Slash, sparks, impa

Read more
Ships withagent-sprite-forge

Languages: English | 繁體中文 | 简体中文 | 日本語 | 한국어 0.4 launch teaser: every frame is real ASF output.

Get the whole plugin
Stats
4,356
Stars
428
Forks
Active
Maintenance
Python
Language
MIT
License
2d ago
Last commit
5mo ago
Created

Repo: 0x0funky/agent-sprite-forge

Other skills on agent-sprite-forge.