Whatnot overlay size and safe area
Design Whatnot overlays at 1080 x 1920 and keep type out of chat, bids, and the card. Do not trust a desktop preview for the size.
On this page
Whatnot overlay size starts at 1080 x 1920. The safe area is whatever is still visible after Whatnot draws chat, bids, and the rest of its chrome, and after your own cam is placed. There is no honest universal pixel inset, because the app's UI moves and your cam is not everyone's cam. Design the canvas at that size, then test on a phone with a real show chrome up.
This is the measurement post. It is not the OBS click-path. Connect and troubleshooting stay on Whatnot's OBS help. How to drop files in once the size is right: Whatnot OBS setup.
| Element | Size rule | Fails when |
|---|---|---|
| Canvas | 1080 x 1920 for every scene | A 16:9 file scaled into the phone |
| Card | A hole that stays clear when chrome is on | Type or a bug through the slab |
| Board type | Readable in a phone screenshot | Cells that only read on your desktop monitor |
| Face cam | A corner that misses the card and the bid cluster | A giant cam and a tiny list |
| Critical words | Inside the area a phone crop still shows | Prices or spot names on the extreme edge |
One canvas for the whole kit
Export the frame, the board, the starting plate, the BRB, and the end card at 1080 x 1920. Mixing sizes is how a board sits a few pixels off and covers a row. Thumbs use the same vertical idea. If the thumb is horizontal, it is a different problem: thumbnail checklist.
Do not publish a fake margin like 'always leave 200 pixels' unless you have measured it on the current app. Whatnot changes chrome. Your test is the source of truth: go live or use a recent VOD, screenshot the phone, see what survived.
Safe means the card and the list survive chrome
Whatnot draws chat, bids, and sometimes a ticker or a giveaway prompt. Your art does not get those pixels. Critical type in that collision is invisible on the night it matters. Leave the holes empty on purpose. A pretty full-bleed frame that ignores the app is a desktop fantasy.
Check starting and live separately. The cam appears and the safe area changes. A title that was fine on the starting plate can land under chat the moment you cut to live.
Face cam loses to the card and the board
People trust a face. They pay for the card and the spot. Put the cam in a corner that stays out of bids and out of the cells buyers need. If the only way your face fits is across the list, shrink the face. A huge cam with a tiny board is the usual first kit, and it is backwards.
Skip a face cam cutout entirely if you do not go on camera. An empty shaped hole looks like a technical failure. Examples of frames that already respect this: best Whatnot overlay examples.
Scenes, not one giant file
Starting, live, and BRB are separate scenes at the same size. One PSD with every layer visible is harder to run and easier to leave wrong. Export the live scene with only the live layers. If your software cannot do that, you are not ready to add motion on top.
- New document: 1080 x 1920. Not a resized horizontal file.
- Block in the card hole and the bid side before you draw the logo.
- Place the board. Read the smallest cell at phone zoom.
- Add the cam last. If it collides, the cam moves.
- Screenshot a live or recent show on a phone. Fix whatever the app ate.
Who should ignore custom size work: sellers on the phone with no art, who only need to hold the item steady. Who should not hire a kit yet: anyone who wants us to invent a pixel-perfect safe zone without a screenshot of their show. Send the screenshot. Service home: Whatnot overlays.
Measure your show, not a diagram from the internet
Take one phone screenshot with chat open and bids visible. Draw over it. Whatever you drew on top of is not safe, no matter what a template claimed. Repeat when Whatnot moves the UI. A safe area from last year is a rumor.
If two scenes at 1080 x 1920 still jump when you cut, the elements are in different places, not different sizes. Line up the logo and the card hole. The canvas match is not enough if the layout slides.
Mark the chrome on a screenshot from your show
Export one frame at 1080 x 1920. Put it in the live scene. Take a phone screenshot with chat open and bids visible. Draw over everything the app covered. Whatever you drew on is not safe, no matter what a template claimed. The card and the list have to live in what you did not draw on. Repeat this when Whatnot moves the UI. A safe area from last year is a rumor.
One canvas for the whole kit. The frame, the board, the starting plate, the BRB, and the end card all export at 1080 x 1920. Mixing sizes is how a board sits a few pixels off and covers a row. A Twitch overlay is the wrong shape. Resizing it does not invent a vertical card hole. Rebuild, or keep that file for a different platform.
Face cam loses to the card and the board. If you do not go on camera, skip the cutout. An empty shaped hole looks like a technical failure. If you do go on camera, the face gets the leftover space, not the product space. Starting and live scenes use the same size. If they jump when you cut, the logo and the hole are in different places. Line them up. Do not 'fix' a jump by scaling one scene.
| File you have | What it does in OBS | What to export |
|---|---|---|
| 1920 x 1080 | Letterboxed, or cropped until the hole is gone | 1080 x 1920, rebuilt |
| A board at a different size than the frame | A row slides under the bid UI | The same 1080 x 1920 canvas |
| A face hole with nobody in it | Looks like the cam failed | No cutout until you actually use the cam |
| Type placed from a diagram, not your screenshot | Chat covers the product name | Move type after you mark your own broadcast |
Measure your show, not a diagram from the internet. Whatnot's own OBS article is where connect steps live. This post is the measurement. If two people on your team export 'the overlay' at two sizes, you do not have a kit. You have a pile. One canvas, then stop debating it.
FAQ
What size should a Whatnot overlay be?
1080 x 1920. That is the vertical canvas that matches how sellers set OBS and how thumbs should be built. Confirm connect details on Whatnot's help if the stream settings differ from the design file.
What is the safe area for Whatnot overlays?
The part of that canvas still visible after Whatnot's chat and bids, and after your cam. Test it on a phone. Do not trust a single pixel number from a blog.
Can I resize a Twitch overlay?
You can scale it, and it will look scaled. Rebuild vertical. Cropping 16:9 into 9:16 deletes the type you cared about.
Where should the facecam go?
In a corner that does not cover the card or the spot names. If it does not fit, make it smaller. The list and the card outrank the face.
Do starting and live scenes use different sizes?
No. Same canvas. Different layers. A size change between scenes is a jump cut you did not mean.
Send a phone screenshot of the live scene through Free Audit, or post it in Discord and point at the thing chat covers.
Need overlays, boards, or a full Whatnot kit sized for your show?
