Sprite Sheet Packer
Packs many images into one atlas and emits the CSS or JSON frame map alongside it.
One atlas and the coordinates that make it usable — because a sprite sheet without a frame map is just a picture of some icons. The packer reports its occupancy, which is the number that tells you whether the atlas is worth having at all.
Drop the icons to pack
An atlas plus the frame map that makes it usable.
How to use it
Drop the icons
The filenames become the sprite names, so they become the CSS class names or the JSON keys.
Leave a gutter of at least two pixels
That is what stops a neighbouring sprite bleeding in when the sheet is drawn scaled or with bilinear filtering — the line down the edge of an icon that nobody can explain.
Pick the map format
CSS is the only one that needs no JavaScript. JSON follows the TexturePacker hash shape, which the common game engines already parse.
Set the pixel ratio if the art is @2x
It divides every number in the map, so the CSS describes CSS pixels rather than device pixels.
Common questions
What does the occupancy figure mean?
How much of the atlas is sprite rather than empty space. Below about half, the packing is fighting sprites of very different shapes and you are downloading a lot of transparency; splitting them into two sheets usually beats it.
Should I still use a sprite sheet over HTTP/2?
For the web, usually not — the request cost that justified atlases is mostly gone, and an SVG sprite or individual files are easier to maintain. For a canvas or WebGL game it is still the right answer, because one texture bind beats fifty.
Why is the atlas not a power of two?
Because it costs space and most current GPUs do not need it. Turn the option on if you are mipmapping or targeting an older texture path, and accept the wasted area.
Feed it from
Image Splitter
Cuts one image into an N×M grid or fixed-height slices and packages the pieces as a zip.
Pixel Art Editor
Draws on a pixel grid with pencil, fill, eraser, eyedropper, palette and mirror symmetry, imports a photo quantised into the grid, and exports PNG at an integer scale or SVG.
PNG Compressor
Quantises the palette and rewrites the deflate stream to shrink a PNG without changing its dimensions.
JPEG Compressor
Re-encodes a JPEG at a chosen quality with a live before/after size and a difference view.
Next
These accept what this tool produces, so the result can go straight in.
CSS Beautifier & Minifier
Formats or minifies CSS without reordering anything, preserving the token stream exactly.
Image Resizer
Resizes by pixels, percentage or a target longest edge, with aspect-ratio lock and batch presets.
PNG Compressor
Quantises the palette and rewrites the deflate stream to shrink a PNG without changing its dimensions.
Background Remover
Keys out a flat or single-colour background in OKLab and returns a transparent PNG, with a brush for fixing the edges.
EXIF Remover
Strips camera, GPS and editing metadata from photos while leaving the pixels untouched.
Favicon Generator
Produces the whole favicon set — ICO, PNGs, Apple touch icon, web manifest — plus the HTML to paste.