Background
About
Characters: 0

📚 Library Management

Image uploads support up to 20 MB each (characters, backgrounds, presentation overlays). Files are stored in this browser, not in the page URL.

Characters

None selected

Backgrounds

Full-stage backdrop only. Use Presentations for overlay images, videos, and websites on the TV.

None selected

Presentations

Overlay images float above the background; TV content (YouTube, website, local video, or local PDF) plays on the stage TV. Pick one in the library, then click Use.

None selected

Mouths

Backup & restore

Download a backup of your library, settings, stage layout, and uploaded images. Import restores everything in this browser. Local video and PDF files are not included — use Link file after import.

☕ Buy me a coffee

Thanks for the support! Choose how you'd like to pay:

⚠️ Reset Library

This will reset your character, background, and presentation libraries back to the default images from the folders. All uploaded images and customizations will be lost.

This will also reset your custom keyboard shortcuts and mouth images back to the defaults.

Are you sure you want to continue?

📱 Mobile Device Detected

This application was designed for larger screens (desktop/tablet) and works best with a keyboard.

For the best experience, please use a desktop or laptop computer.

🎭 Welcome to Puppet Animator!

Get started quickly with these tips. Reopen anytime with ❓ Help in the top bar. Use the button below to choose whether this guide appears when you launch the app.

🎬
Recording your show
This app does not record video — most people use OBS Studio (free) to capture this browser window or tab. Press M to hide the top bar and buttons for a clean frame before you start recording in OBS.
⚙️
Settings Button
Click the ⚙️ Settings button in the top right to see every control and adjust character options like size and mouth alignment. Scroll down to Customize Keyboard Shortcuts — click any key to reassign it, or use Reset to Defaults to restore the original layout.
📺
Presentations (5 options)
In 📚 Library → Presentations, choose what to show on stage:
1. Overlay image — PNG/JPG above the background, below your puppet. Align in ⚙️ Settings; nudge with IJKL.
2. YouTube — paste a URL; plays on the TV. Use V / B / N for back, play/pause, forward.
3. Local video — pick a file from your computer (never uploaded to our servers).
4. Website — paste an http/https URL; the site opens inside the TV screen. Click and scroll to interact. Press B or tap ⛶ Fullscreen website below the TV to expand it. Some sites block embedding — if the screen stays blank, try another URL.
5. Local PDF — pick a PDF from your computer; it opens in the TV (file stays on your device, not in browser storage). Press B or tap ⛶ Fullscreen PDF below the TV.
📚
Library Button
Use the 📚 Library button to manage characters, backgrounds (full-stage images), and presentations (the five types above). Keep your backdrop separate from what you present on the TV.
👥
Multiple puppets on stage
Tap + Add Character to place another puppet. Only one is active at a time — it gets a red dot underneath and receives keyboard input.
Select a puppet: click it on stage, or press { / } to cycle between puppets. Size and mouth settings in ⚙️ Settings apply to the active one.
1-9 swaps the costume (library image) for the active puppet, not which puppet is selected. Use − Remove Character to delete the active puppet.
⌨️
Keyboard Controls
Below is a quick reference — open ⚙️ Settings anytime to see the full list and change any key under Customize Keyboard Shortcuts.
Animation: W Mouth Up | S Mouth Down | A Rotate Left | D Rotate Right
Movement: Arrow Keys | Space Jump
Characters: { } Select puppet on stage | 1-9 Change active puppet’s costume
Backgrounds: < > Cycle
Presentations: ; ' Cycle | O Hide/Show presentation | IJKL Move overlay image
Video (TV): V Back | B Play/Pause | N Forward (YouTube & local video only)
Website / PDF (TV): B Fullscreen (or button below TV); click inside the TV to interact (website)
UI: H Hide/Show Character | M Hide/Show UI | R Reset | Esc Close Settings
🎤
Microphone auto-trigger
In ⚙️ Settings, turn on Auto-trigger key from microphone to animate while you talk. Loud sounds hold your chosen key; quiet releases it. Default is jump (Space) — click the key button to change it (mouth, rotate, etc.).