Twitch Sub Badge Resizer

Twitch subscriber badges need three square sizes — 72, 36 and 18 pixels — each under 25 KB. Crop once here, export all three as a ZIP, and see every file measured against the cap. The 18-pixel version is the one that decides whether the design works.

Nur lokal

Die Oberfläche dieses Tools ist auf Englisch.

Drop a PNG, JPG, WebP or GIF

or drop anywhere on this page · Choose a file · 100 MB

Die folgende Anleitung ist nur auf Englisch verfügbar.

Subscriber badges are the small marks beside a viewer's name in chat, and they use their own set of sizes: 72 by 72, 36 by 36 and 18 by 18. They are not the emote sizes, and uploading emote files into the badge form produces a set that is subtly wrong everywhere.

Eighteen pixels is the size that matters. That is what appears next to a username in chat, and at eighteen pixels an illustration is not an illustration — it is a shape and a colour. Badges that read well are almost always a single bold form: a heart, a crown, a letter, a simple animal head with no interior detail at all.

This page holds the three badge frames, exports them together as a ZIP, and measures each file against Twitch's 25 KB cap. Everything runs in your browser, so a badge set commissioned and not yet announced stays on your machine.

Emotes use a different trio of sizes, so the emote resizer is the page for those.

If the badge arrived as a format the browser will not open, such as a layered file, convert it to PNG first.

The badge sizes and where each appears

Three sizes, one purpose each. The smallest is the one viewers actually see thousands of times an evening.

Size	Appears in	What reads at that size
72 × 72	Badge settings and previews	Full artwork, including modest detail
36 × 36	Larger chat layouts and overlays	The main shape and its outline
18 × 18	Beside a username in chat	One silhouette, one or two colours

Designing for eighteen pixels

An eighteen-pixel square holds 324 pixels in total. There is room for one idea. Anything with an interior — a face with eyes, a logo with a counter-form, a number with two digits — collapses into a blob.

Work the other way round: sketch the badge at 18 first, decide whether it is legible, then add whatever detail the 72-pixel version can carry. The tiers of a badge set should also differ by shape or colour rather than by detail, because detail is the first thing the small size removes.

One silhouette, no interior detail smaller than about a quarter of the badge.
High contrast against both Twitch's dark chat and a light theme.
Distinguish tiers by colour and outline weight, not by added ornament.
Avoid thin outlines: one pixel at 72 is a quarter of a pixel at 18, which is nothing.

The 25 KB cap in practice

For a well-designed badge the cap is not a constraint at all: flat colour at 72 pixels square compresses to a couple of kilobytes as PNG. It only bites when artwork arrives as a rendered 3D object, a photograph or an illustration heavy with gradients.

If that is what you have, exporting WebP lets the quality search find a version that fits. But a badge that needs gradients to work is usually a badge that will not read at 18 pixels either, so the cap is often warning you about the design rather than the encoder.

What goes into the upload form

Twitch asks for a badge per subscriber tier and per month milestone, each with the three sizes. The ZIP from this page contains one file per size, named by dimension, so matching them to the form's three slots is unambiguous. Repeat the crop for each tier's artwork.

Frequently asked questions

What size is a Twitch sub badge?

Three sizes are required: 72 by 72, 36 by 36 and 18 by 18 pixels. All are square and all must be under 25 KB. They are deliberately different from the emote sizes, so a set exported for emotes will not fit the badge upload form.

Why does my badge look like a blob in chat?

Because chat renders the 18-pixel version, and that is 324 pixels in total. Interior detail, thin outlines and anything with a counter-form merge into one mass. A badge that reads is a single silhouette in one or two high-contrast colours.

How should badge tiers differ from each other?

By colour and by outline weight, not by added ornament. At 18 pixels an extra flourish is invisible, so a set that distinguishes tiers with more detail looks identical in chat. Changing the hue and the overall shape is what a viewer can actually tell apart.

Do badges have the same file size limit as emotes?

Yes, 25 KB per file. It is rarely a problem for badge artwork, which is usually flat and simple by necessity. When it does bite, the cause is normally a rendered or photographic source — and that source will have legibility problems at 18 pixels regardless.

Can I reuse my emote artwork as a badge?

You can crop from it, but the sizes differ and the legibility bar is higher. An emote is seen at 28 pixels in chat; a badge at 18, beside text rather than alone. Artwork that just survives as an emote usually needs simplifying before it works as a badge.

Is my badge artwork uploaded when I export here?

No. The crop, the three resizes, the encoding and the ZIP are all produced in this browser tab. Nothing is transmitted, there is no account, and you can confirm it in DevTools before trusting it with artwork you have not published.

ToolsByUs team · How we check our tools