28px is where emotes live
The 112px version is what you admire while uploading; 28×28 is what viewers actually see, scrolling past at speed. Judge your emote on the smallest preview above — if it does not read there, nothing else matters.
Drop a drawing, a render or a screenshot — crop it square, cut the background, add the outline, and take away the full 112 / 56 / 28 set ready to upload. Animated GIFs work too. Free, no account, and your artwork never leaves the browser.
Drop your artwork here
PNG · JPEG · WebP · GIF — or paste from clipboard
A drawing, a render, a cropped photo of your cat — anything works. Square art is easiest, but rectangular images are handled: Fit pads them into the square, Fill crops to the centre. You do not need Photoshop for this part.
Turn on Remove background to clear a flat backdrop, then add an outline. That outline is what separates a real emote from a shrunken picture — it keeps the shape legible against both the light and dark chat themes.
Twitch wants every emote three times over — 112×112, 56×56 and 28×28 — each under 25KB. All three are generated and compressed for you, named and zipped ready for the Creator Dashboard.
The 112px version is what you admire while uploading; 28×28 is what viewers actually see, scrolling past at speed. Judge your emote on the smallest preview above — if it does not read there, nothing else matters.
A whole character rarely survives the shrink. A single expressive face, hand or object does. Crop tight with Fill rather than fitting an entire body into 28 pixels.
A contrasting outline of roughly 2–4% is what keeps your emote from dissolving into the chat background. White works on dark themes, dark on light — a mid-tone outline covers both.
Bold shapes and high contrast survive downscaling; fine linework, gradients and small text turn to mush. Drop the detail before the pixels drop it for you.
Emotes sit directly on chat, so the background has to actually be gone. Exports here are PNG with the alpha channel intact — no white square, no grey matte at the edges.
If your emote is done and only needs the three sizes, skip the editor — the Twitch emote resizer takes a batch of finished files and returns every size in one pass.
Start from any drawing, photo or render. Crop it to a square, cut away the background so the shape reads on its own, add a contrasting outline so it survives at chat size, then export it at 112×112, 56×56 and 28×28. This page does all four steps in the browser.
No. The parts of emote making that actually matter — square crop, background removal, outline and the three export sizes — are all handled here. A drawing app is only needed if you are creating the artwork itself from scratch.
Every emote is uploaded in three square sizes: 112×112, 56×56 and 28×28 pixels. Static emotes must be under 25KB per file; animated emotes are GIFs and may go up to 1MB.
Yes. Drop an animated GIF and every frame gets the same crop, outline and background treatment, then the whole animation is re-encoded at all three sizes with its original timing. The preview shows the first frame; press Render animated emote to process the rest.
Turn on Remove background. The colour is sampled from the four corners and flood-filled inward, so only background connected to the edge is cut and matching colours inside the artwork survive. Raise the tolerance for a slightly uneven backdrop; lower it if part of your art starts disappearing.
No. Every step runs locally on an HTML canvas in your own browser. Unreleased emote art never touches a server, and closing the tab leaves nothing behind.
Made the emote? The rest of the channel needs its own sizes — the hub compares all seven specs and resizes them from a single upload.
Bloggers, mods, and forum members are welcome to share this page. Copy the snippet below to credit the source.
<a href="https://emoteresize.com/twitch-emote-maker/">Twitch Emote Maker</a> — free online tool