Video Safe Zone Checker
Preview TikTok, Instagram Reels, and YouTube Shorts UI overlays on your own video frame. Keep text, logos, and key visuals visible — entirely in your browser.
1 · Upload Frame
No image loaded
2 · Select Platform
3 · Overlay Settings
Preview — TikTok
| Zone | Risk | X | Y | Width | Height |
|---|
What are video safe zones?
Video safe zones are the areas of a vertical frame where critical content — captions, logos, faces, and call-to-action text — stays visible after a platform layers its own interface on top. On TikTok, Instagram Reels, and YouTube Shorts, native UI elements (action rails, caption blocks, channel bars, navigation headers) sit directly over your video. Anything placed underneath them gets hidden.
This checker overlays each platform's typical UI zones onto your own frame, so you can see exactly what will be covered before you publish — and keep every important element inside the safe zone.
Why safe zones matter for short-form video
Vertical mobile video is covered by multiple UI layers at once:
- Action rails — like, comment, share, and save buttons stacked on the right edge
- Caption blocks — username, description, hashtags, and music ticker at the bottom
- Headers and nav — tabs, search, and status bars at the top
- Dynamic elements — polls, stickers, and pinned comments that appear unpredictably
A caption or logo hidden behind these elements costs you comprehension, engagement, and conversions. Planning around safe zones is the cheapest fix in your entire production pipeline.
Platform safe zone comparison (1080 × 1920)
Typical clear-area dimensions for the standard 9:16 vertical format:
| Platform | Safe area (approx) | Main obstructions |
|---|---|---|
| TikTok | 890 × 1450 px | Right action rail (130px), bottom caption (320px), top tabs (150px) |
| Instagram Reels | 930 × 1270 px | Right actions (110px), bottom info block (430px), top header (220px) |
| YouTube Shorts | 930 × 1470 px | Right engagement icons (120px), bottom title bar (300px), top nav (150px) |
Best practices for safe-zone-safe design
- Keep text inside the green safe zone — the area clear of all platform UI on every major app
- Leave the bottom 15–22% empty — caption blocks grow with longer descriptions and hashtag stacks
- Clear the right 12–14% — engagement rails are the most consistent obstruction across platforms
- Center-face your subject — faces near the edges get clipped by rails and captions first
- Export a marked-up reference — download the overlay PNG to share exact constraints with editors and designers
- Verify on real devices — overlays are guidelines; UI layouts shift with app versions and A/B tests
How this tool works
Your frame is drawn to a full-resolution 1080 × 1920 canvas using the Canvas API, then platform zone data (last updated September 2026) is rendered on top as danger, caution, and safe regions. Switch platforms, toggle zone types, adjust opacity, and choose fill or fit scaling — all in real time. The Download PNG button exports your frame with or without the overlay baked in.
Everything runs locally in your browser. No uploads, no accounts, no tracking — your frames never leave your device.
Frequently asked questions
No. Safe zones are guidelines based on typical platform layouts. Real UI positions vary with device size, aspect ratio, app version, operating system, localization, and A/B tests. Always spot-check on a physical device before publishing important content.
TikTok's caption block is shorter (320px vs 300–430px elsewhere) but its right-side action rail is wider and starts higher up the screen. The combined obstructions leave a slightly smaller clear rectangle than YouTube Shorts.
This tool targets the 9:16 vertical format (1080 × 1920) used by TikTok, Reels, and Shorts. Landscape and square formats have completely different UI layouts and would need separate zone data.
No. The image is read with FileReader and drawn to a local canvas inside your browser. Nothing is transmitted, stored, or logged. The tool even works offline once the page is loaded.
Yes. Keep "Include overlay in export" checked and click Download PNG to save a marked-up reference image — useful for briefing editors, designers, or clients on exactly where content must stay clear.
The current dataset reflects platform layouts as of September 2026. Platform UIs change frequently, so revisit the tool periodically — and always confirm critical layouts on-device.