Guide
YouTube thumbnail safe zones and mobile crop
You design a 16:9 poster. Viewers see a smaller poster with a title, a time badge, and on phones a crop. Plan for the chrome.
Desktop and TV
The still is shown close to 16:9. Duration sits on a corner. Hover and focus states add extra UI. Text on the extreme bottom edge is the first casualty. Faces jammed into a corner get a badge on the cheek.
Phone home
The card is narrower in the layout even when the image file is 16:9. YouTube draws a stronger gradient behind the video title. If your thumbnail already has a sentence on the bottom, you now have two sentences fighting. Keep type in the upper two-thirds. The safe-zone preview puts a fake title bar and duration chip on the real CDN still.
Shorts shelf
Extra vertical crop. Center column. Details in Shorts thumbnails.
Contrast under a gradient
Sample the still with the palette tool. If the bottom of the image is already dark, a dark title vanishes. If it is white, a white title vanishes. You are designing a composite, not a poster in isolation.
A simple safe-zone checklist
- Face in the middle third, large enough at ~120px wide.
- One to three words, not a paragraph.
- No important type in the bottom 20% or the far corners.
- Padding on all four edges so duration badges do not sit on an eye.
- Preview on a real phone with the thumbnail preview.
Keep type here (upper two-thirds)
┌──────────────────────────┐
│ FACE + 1–3 WORDS │
│ │
│ (avoid bottom title UI) │
└──────────────────────────┘Burnt-in title vs YouTube’s title
If the JPEG already has the video title in huge type, the in-app title will stack on it on mobile. Pick one: a quiet still plus a strong Studio title, or type in the image plus a short Studio title. The preview makes that clash obvious before you publish.