Emote Studio

Browser tool to create, recolor, and download custom emotes for Twitch and 7TV.

Edit your own art, starter faces, or popular 7TV emotes (including animated GIFs), then export size packs ready to upload.

Live

https://franklinelliott.github.io/emote-studio/

Repo: https://github.com/FranklinElliott/emote-studio

Features

Sources

• Upload PNG / WebP / GIF (animated GIFs keep playing)
• Popular / 7TV — search community emotes (KEKW, catJam, monka…) and click to edit
• Starters — original reaction faces (Hype, LOL, Sad…) you can recolor freely
• Text base — generate a simple text/emoji emote

Color

• Off, Gold, Silver, Ruby, Ice, Toxic, Neon, Sunset, B&W, Invert
• Click the same color again or Off to turn color off
• Optional animated shine + speed control

Overlays

• Text and banner layers (drag on canvas)
• Stickers (crown, fire, stars, etc.)
• Layer scale / rotate / delete

Crop & scale

• Zoom + pan square crop
• Smooth or pixel-art scaling
• Brightness / contrast / saturation / flip

Export

Platform	Sizes
Twitch	28 · 56 · 112
7TV	28 · 56 · 112 · 128

• ZIP packs per platform (or both)
• Animated GIF button → single looping 112×112 file
• Fully client-side — images never upload to a server

Animated emotes (important)

File in pack	Moves?	Use for
name_112x112_static.png	No	Still preview / platforms that want PNG
name_112x112.gif	Yes	Upload when you want motion
name_animated_112.gif	Yes	Quick 112 animated export

• When you load a moving 7TV emote, the pill shows Animated · Nf
• Packs then include .gif files for each size
• PNG is always a still frame — open the .gif if it should move

How to use

1. Open https://franklinelliott.github.io/emote-studio/
2. Pick a source:
   • Upload art, or
   • Popular / 7TV → search → click an emote, or
   • Starters / text base
3. Optional: Color (Gold, Silver, Ruby…), shine animation, text, stickers
4. Crop / zoom until previews look right
5. Set emote name (filenames)
6. Download:
   • Twitch pack / 7TV pack / Both, and/or
   • Animated GIF
7. Upload the right files in Twitch dashboard or 7TV

Quick golden animated KEKW

1. Popular → search KEKW or catJam
2. Confirm pill: Animated · …f
3. Color → Gold (toggle Off anytime)
4. Optional: crown sticker + text
5. Download pack → upload the .gif files

Rights / fairness

• Searching loads from 7TV’s public CDN into your browser only — this site does not rehost emotes
• Only re-upload emotes you created or have permission to use
• Official Twitch global emotes are not bundled in this repo
• Starter faces are original templates for you to customize

GitHub Pages

1. Repo Settings → Pages
2. Source: Deploy from a branch
3. Branch: main / folder: / (root)

Files

Path	Role
index.html	Full app (static, no build)
.nojekyll	Disables Jekyll on Pages
README.md	This file

Stack

• Vanilla HTML / CSS / JS
• JSZip — pack downloads
• gif.js — animated GIF export
• gifuct-js + ImageDecoder — animated source playback
• 7TV GraphQL API + CDN (client-side only)

License

Use freely for your streams and emote packs. Credit appreciated but not required.