pixelfx: pixel art effects from Claude Code

Fire, explosions, frost, pickups: pixelfx draws 244 game effects entirely in JavaScript, with no image files. It ships with a Claude Code skill that teaches Claude to find, use, export and make effects. The code and the skill are MIT licensed. The method comes from Hugo Duprez's guide on making pixel art effects with Claude: one-shot prompts give mediocre effects, drafts you render and look at give good ones. For how skills load, see Claude Code skills.

What the skill does

1. Searches before it builds. It runs node tools/list.mjs frost and the like, renders the candidates and looks at them. The SKILL.md tells Claude to check first whether an existing effect fits with a new palette or seed before writing a new one.
2. Puts it in your game. A canvas, Phaser, PixiJS, Kaplay or three.js game uses the code directly. Godot, Unity, GameMaker, Defold, LÖVE, Bevy and Construct get a sprite sheet: a transparent PNG grid plus Aseprite-style JSON with the frame rate and pivot.
3. Makes new effects. It writes three to five different drafts when the brief is open, renders a contact sheet of each, picks one and fixes the worst flaw each round, three rounds at minimum. A checker flags drawing outside the canvas, loop seams, unseeded randomness and slow frames.
4. Acts out hits. Effects that involve a character come with timing for the wind-up, a freeze on contact and the recovery.

The SKILL.md carries a table of fixes for what Claude sees on a contact sheet. "Floaty, no punch" gets a fast start, a slow finish and a white flash frame; "washed out" gets less glow and darker edges.

How to install it

As a Claude Code plugin, run these one at a time:

/plugin marketplace add patch-gg/pixelfx
/plugin install pixelfx@pixelfx

Or copy skills/pixelfx into ~/.claude/skills/. The tools need Node 18 or newer and nothing else; ffmpeg is optional, for GIF and MP4 previews. If your project has no pixelfx checkout, the skill clones the repository next to it.

Things to ask it

• "Add a frost nova to my mage's ultimate."
• "Make five takes on a coin pickup sparkle and show me the best two."
• "Export the fire and explosions categories as sprite sheets for Godot."
• "This hit effect feels floaty. Make it punchier."

Limits

• Claude has to see images. The loop depends on reading the rendered PNG contact sheets, so it needs an agent that can open image files.
• Glow is baked into sheets. In an exported sprite sheet, glow reads well over dark scenes. For bright scenes, the skill says to render a recolored version or keep the effect on a dark layer.
• No copies of other games. It's told never to recreate a specific game's sprites, characters or logos.
• The font isn't MIT. The gallery's Patch Pixel font belongs to Patch and sits outside the license.

When to use it

• A browser or indie game that needs hit effects, pickups or weather.
• Sprite sheets for an engine that can't run JavaScript.

For animated GIFs rather than game assets, use Anthropic's slack-gif-creator. For generative art in p5.js, use algorithmic-art.

Sources

1. patch-gg/pixelfx README — GitHub, accessed November 2026
2. pixelfx SKILL.md — GitHub, accessed November 2026