pixelfx: 244 Free Pixel Art Effects That Are Code, Not Sprites. That Changes What a Revision Costs
A pixel art fireball is usually a strip of hand-drawn frames. Change the colour, and you redraw it. Make it bigger, and you redraw it. Want it to face left, burn blue for the ice level, and hold on the hit for an extra beat? That is three more passes through the same twelve frames.
The pixelfx library throws that model out. Its 244 effects contain no images at all. Each one is a short program that paints pixels over time, and a request like "make the torch burn blue" becomes a single setting instead of an afternoon. The repository went up on October 30 and passed 1,889 stars on GitHub within two days, which tells you how many indie developers have been redrawing fireballs.
The interesting part is not the size of the library. It is what happens to the cost of changing your mind.
What pixelfx is, in plain terms
pixelfx is a free collection of game effects from Patch, a small studio that makes browser games and mods. The categories read like a game designer's shopping list: fire, explosions, water, ice, lightning, sci-fi, melee swings, impacts, projectiles, spawns and deaths, arcane, holy and shadow magic, status effects, weather, UI flourishes, pickups, screen transitions and little critters like bats and fish schools. Twelve "moves" chain several effects into whole attacks.
Each effect lives in its own file. You can play every one in a free browser gallery, where buttons let you swap the palette, roll a new random variation, toggle a backdrop and view the sheet for the character version.
Three things make it useful outside a demo:
It exports to any engine. One command writes a transparent PNG with every frame laid out in a grid, plus a small data file in the format Aseprite uses, with frame positions, timing and the anchor point. Per the README, Phaser's loader and the Aseprite importers for Godot and Unity read it.
It drops straight into a browser game. If you build with plain canvas, Phaser, PixiJS or three.js, you can skip the sprite sheet and run the effect live, with no other software required.
It is MIT licensed. The README says it plainly: "Use them in anything, commercial included." The one exception is the Patch Pixel font used in the gallery, which is the studio's own.
Why code beats drawings for effects
The idea behind pixelfx comes from Hugo Duprez at Sprite Fusion, who published How to make (good) pixel art effects with Claude on October 28. His first rule is "code is clay." Image sprites are rigid. Code can be pushed around.
Here is what that means in practice. A drawn explosion is a finished object. A coded explosion is a recipe: spawn forty sparks here, fling them outward at these speeds, add a glow that fades over this long. Every number in that recipe is a dial.
So the library exposes dials. Pass a palette, a list of colours from dark to bright, and the same fire burns purple. Pass a seed and you get a different but equally tidy variation, which is how you avoid every coin pickup in your game looking identical. Pass flip or angle and the effect faces wherever your character faces. Because every random number comes from the seed, frame 40 looks the same every time you render it, so your sprite sheet will not change on you between exports.
There is a second, subtler win. Effects are drawn into two layers: one for the solid pixels and one for added glow laid over the top. The README credits that glow layer for why "hot things look hot." When you recolour, the glow follows the new palette, so a blue fire still reads as fire and not as a blue sticker.
Physics-style effects, the ones with debris and smoke, run their simulation many times a second, independent of your game's frame rate. Sparks bounce the same whether your game runs at 30 or 144 frames per second.
The part most effect packs skip: the body
Watch most free effect packs and something feels off. The slash looks fine. The hit looks fine. But nothing sells it.
The pixelfx authors put their finger on why: "An effect on its own looks like a sticker. What sells a hit is the body around it." So the 61 effects that involve a character, plus the 12 moves, are acted out. A plain grey stand-in character winds up, lets go, freezes on contact, and recovers, while a straw target rocks back and the screen shakes.
That timing ships as plain data you can read. For a sword slash, the file says when the guard pose starts, when the wind-up begins, the exact moment of contact, and how long everything freezes on the hit (0.14 seconds in the example). If you have your own character, you do not use the grey dummy. You read those numbers and start your own wind-up animation that long before the effect, then pause your game for the freeze.
That is a small thing written down, and it is the difference between a game that feels crunchy and one that feels floaty. Animators know this. Most effect libraries do not encode it.
Put this into practice
You need Node 18 or newer and nothing else. No graphics card, no account, no paid service. ffmpeg is optional, for GIF and MP4 previews.
Step one: browse before you build. Open the gallery and play the categories closest to your game. Most requests turn out to be an existing effect with different settings. If you clone the repository, node tools/list.mjs frost searches names, tags and descriptions.
Step two: recolour for your world. Pick a palette that matches your art. The README's example turns a torch purple with one command:
node tools/render.mjs fire/torch --gif --opts '{"palette": ["#102","#215","#43a","#8cf","#cff","#fff"]}'
Keep the list ordered dark to bright. Start with five or six colours you already use in your tiles.
Step three: export a sheet for your engine.
node tools/render.mjs ice/frost-nova --sheet
That writes the PNG grid and the data file. node tools/sheets.mjs exports the whole library at once if you want a folder to pick from later.
Step four: wire the timing. For melee and spell effects, open the data file and look for the wind-up, recovery and hit timing. Match your character's animation to it. Do this one even if you skip everything else.
Step five, optional: make new ones with an agent. The repository includes a skill for Claude Code, a set of instructions the coding assistant follows. Install it with /plugin marketplace add patch-gg/pixelfx and /plugin install pixelfx@pixelfx, then ask for what you want in your own words: "Make five takes on a coin pickup sparkle and show me the best two," or "This hit effect feels floaty. Make it punchier."
The skill follows Duprez's loop. It drafts several versions, renders each one to a contact sheet (every frame laid out on one image), looks at them, and refines. You can run the same loop by hand with node tools/new.mjs, node tools/render.mjs and node tools/check.mjs, which flags pixels that spill outside the frame, visible seams in loops and slow frames.
A position on what this is for
I would treat pixelfx as the best free starting kit an indie pixel game has had, and I would not treat it as finished art.
Duprez is direct about this in his post. He says prompts you copy and paste fall short for pixel effects, that "if you want great results, you need to put in the work," and that he spent hours perfecting a single missile-launcher effect. His second rule is "trust your eyes," and his third is "feed your references." He studied lightning in Path of Exile 2 and fire and destruction in Arc Raiders.
pixelfx encodes the first rule and half of the second. The render and look loop is built in. The taste is not, and it cannot be. The library's 244 effects share one hand, one grey dummy and one sense of timing. Ship them untouched and your game will feel like other games that shipped them untouched.
The cost shift is still real. Before, trying a blue variant of your spell meant committing an hour to find out you hated it. Now it costs a line. That makes exploring cheap, which is exactly when an artist with a strong eye pulls ahead.
Where it breaks
The library has a house style. Everything is drawn at the scale of a 24 by 38 pixel character, with detail at the single-pixel level. If your game uses chunkier sprites or a very different look, expect to rework effects rather than recolour them.
Effects painted on the body use the stock dummy. Frost creeping over a character, poison bubbling on skin and similar effects are drawn against the grey stand-in. The README says to regenerate those if you ship them with your own character.
Making new effects means working in code. Using the existing 244 needs no programming. Creating your own, with or without the agent, means editing JavaScript files or directing a coding assistant that does. Paid coding agents cost money, and the skill was written for Claude Code.
Code effects are not hand animation. Particles and glows are where code shines. A carefully keyed character animation, a bespoke boss transformation, or anything that depends on drawn shapes with intent still belongs to a person drawing frames.
Young project. It is days old. Expect changes to file names and options, and pin a copy if you build on it.
What to do this week
Open the gallery and play the fire category with the palette button. Watch how a single control changes the mood of the same effect. Then pick the one effect your game uses most, the basic hit or the coin pickup, export it in your palette, and put it next to whatever you have now.
If it is better, you just saved a day. If yours is better, you now know exactly why, because you can see the difference side by side. Either way, the next revision costs less than the last one did, and that is the habit worth building.