9:16 video caption safe zones: TikTok, Reels and YouTube Shorts
← 博客
🎬 字幕与隐藏字幕6 min read

9:16 video caption safe zones: TikTok, Reels and YouTube Shorts

💡 For a 1080x1920 vertical video, MarginV=180 in your .ass Style line clears the action button stack on TikTok, Reels, and YouTube Shorts. Push to MarginV=350 to also clear TikTok's description text overlay. The right-side button strip (roughly 80-110px wide) rarely clips centered captions at normal line lengths. These zone heights are practitioner measurements: TikTok, Instagram, and YouTube do not publish caption-specific pixel specs for their UI safe zones.

Key takeaways

  • MarginV=180 clears the action button stack on all three platforms. MarginV=350 additionally stays above TikTok's description text overlay, which sits higher in the frame than the button stack alone.
  • The right-side button strip is roughly 80-110px from the right edge. Centered captions with MarginL=MarginR=20 stay clear at normal line lengths (up to 12 words at Fontsize=68).
  • None of TikTok, Instagram, or YouTube publish caption-specific pixel specs for their UI safe zones. The zone heights below are from visual inspection of each platform's current iOS app, labeled as practitioner measurements.
  • For a video published across all three platforms, MarginV=250 is a reliable universal baseline that clears the button stack with comfortable clearance on every platform.
  • To move one specific cue to the top of the frame, add {\an8} at the start of that Dialogue line's Text field. All other cues stay at the Style-line default.

Which UI zones cover your 9:16 frame?

Every vertical platform layers its interactive controls directly onto the video canvas. There are three zones to check before setting caption margins on a 1080x1920 frame.

The bottom zone is the most critical. Like, comment, share, and follow buttons stack vertically along the bottom-right area of the frame. On TikTok and Instagram Reels, the creator's description text, handle, and audio badge also overlay the lower-left, extending the effective bottom zone higher than the button stack alone.

The right-side strip holds the action button icons. The strip is roughly 80-110px wide from the right edge. The icons run vertically down the right side, but their horizontal footprint is narrow enough that centered captions at typical line lengths stay clear.

The top navigation bar is a thin strip at the top, roughly 60-80px tall, showing platform branding. It only matters if you push a cue to the top with the inline override {\an8}.

Measured zone heights: TikTok, Reels and Shorts

The table below shows my measured UI zone heights for 1080x1920, from visual inspection of each platform's current iOS app. These are not official platform specs. Platform UI updates can shift any of these values by 20-40px.

ZoneTikTokInstagram ReelsYouTube Shorts
Top navigation bar~75px~75px~80px
Right button strip (from right edge)~110px~110px~100px
Bottom: action button stack~165px~160px~140px
Bottom: description text + button stack~340px~275px~220px

The key difference: TikTok's description text overlay is taller than on Reels or Shorts because TikTok shows more lines before truncating. A caption at MarginV=180 clears the button stack but sits inside TikTok's description zone when the description has visible text. If the TikTok description is short or the video uses a very short caption text, MarginV=180 is fine. If you expect a visible multi-line description, use MarginV=350 for TikTok uploads.

Which .ass settings clear each zone?

I keep one .ass file per project with a single Style named "Default". I change only the MarginV value before re-rendering for a different platform target. Here are the three values I use:

[Script Info]
ScriptType: v4.00+
PlayResX: 1080
PlayResY: 1920
WrapStyle: 0
ScaledBorderAndShadow: yes

[V4+ Styles]
Format: Name, Fontname, Fontsize, PrimaryColour, SecondaryColour, OutlineColour, BackColour, Bold, Italic, Underline, StrikeOut, ScaleX, ScaleY, Spacing, Angle, BorderStyle, Outline, Shadow, Alignment, MarginL, MarginR, MarginV, Encoding

; Clears button stacks on YouTube Shorts (MarginV=160)
Style: Default,Arial,68,&H00FFFFFF,&H000000FF,&H00000000,&H80000000,0,0,0,0,100,100,0,0,1,3,0,2,20,20,160,1

; Safe for all three platforms - button stacks cleared (MarginV=250)
; Style: Default,Arial,68,&H00FFFFFF,&H000000FF,&H00000000,&H80000000,0,0,0,0,100,100,0,0,1,3,0,2,20,20,250,1

; Clears button stack and TikTok description text (MarginV=350)
; Style: Default,Arial,68,&H00FFFFFF,&H000000FF,&H00000000,&H80000000,0,0,0,0,100,100,0,0,1,3,0,2,20,20,350,1

Uncomment the line that matches your target. The three MarginV values map to the table rows:

  • MarginV=160: just above YouTube Shorts' ~140px button stack, with ~20px clearance.
  • MarginV=250: universal safe baseline, clearing all three platforms' button stacks (max ~165px measured) by 85px or more.
  • MarginV=350: TikTok-specific, clearing both the button stack and the description text overlay (~340px measured).

The full style tutorial explaining every other field (Fontsize, PrimaryColour, Outline, WrapStyle) is in my .ass subtitle styling guide for 1080x1920 vertical video.

Does the right-side button strip affect centered captions?

For Alignment=2 (bottom-center), the subtitle text area spans from MarginL to PlayResX - MarginR. With MarginL=MarginR=20, the available width is 1040px, and text is horizontally centered within this zone.

A centered 68pt Arial line of 10 to 12 words is typically 550 to 700px wide. That leaves at least 170px of horizontal buffer on each side before text reaches either margin. The right button strip at ~110px sits inside the right margin zone, so centered captions clear it at standard line lengths.

The strip becomes a concern in two cases: using Alignment=3 (bottom-right) with text aligning flush to the right edge, or lines longer than 15 words at Fontsize=68. In either case, push MarginR=120. Be aware this offsets the text block slightly to the left, since the available zone narrows by 100px on the right side.

How do I verify my margin before uploading?

I preview the styled file with ffplay before any encode. This renders the subtitle in real time without writing a file:

ffplay -vf "ass=in.ass" input.mp4

At 1080x1920, the preview renders at full resolution and shows the subtitle against the actual video frame. I check that the caption baseline sits above the bottom 10-18% of the frame (the button zone), and that no long line reaches into the right margin area.

For the final burn-in, the full encode command is:

ffmpeg -i input.mp4 \
  -vf "ass=in.ass" \
  -c:v libx264 -crf 18 -preset slow \
  -pix_fmt yuv420p \
  -c:a copy \
  output.mp4

After uploading to TikTok or Reels, I always check the in-app preview before publishing. The preview is the most reliable final check for any safe-zone margin, since it shows the exact UI overlay on the final rendered output.

What can I set up myself, and when does a specialist save time?

The .ass settings and ffplay workflow above cover most creator subtitle use cases without outside help. One template file, one ffmpeg command, and a visual check in the app are the full workflow.

A specialist saves time when:

  • Translating to Vietnamese or another language: Vietnamese lines expand significantly compared to English and can push past CPS limits or into the right-side zone. I handle this in Subtitle Edit's dual-language view with per-line CPS checking.
  • Streaming platform deliveries: Netflix, Amazon, and Apple TV+ require a sidecar subtitle file in a specific delivery format, not a burned-in video. Those deliveries have officially documented safe zones in the Netflix Timed Text Style Guide.
  • Batch encoding for multiple platforms: if you need separate burns for TikTok (MarginV=350) and Shorts (MarginV=160) from the same source, a scripted workflow is faster than repeating the encode manually.

For creator burn-in and streaming subtitle deliveries, including Vietnamese translation, see my vertical subtitle and captioning services.

FAQ

Does MarginV work the same way in SRT or WebVTT as in .ass?

No. SRT has no position metadata at all; the player decides where to render cues. WebVTT supports percentage-based cue settings (line:, position:) but their behavior varies across browsers. For burned-in vertical video, .ass with MarginV is the only format that gives precise pixel control over cue placement before encoding. For web video (<video> element), WebVTT with line:90% gives a rough bottom-of-frame placement.

Can I use the same MarginV values on a 4K vertical canvas (2160x3840)?

Not directly. ASS values scale relative to PlayResY. To match the same visual position on a 2160x3840 canvas, double each MarginV: 160 becomes 320, 250 becomes 500, 350 becomes 700. The proportions stay the same; the pixel number doubles because PlayResY doubled. Always match PlayResX and PlayResY to your actual output dimensions first.

What if the platform updates its UI and my margin is now too small?

Run ffplay -vf "ass=in.ass" input.mp4 to preview the current file, then upload a short test video and check the app preview before publishing. Platform UI updates typically shift zones by 20-40px. Adjust MarginV by that amount and re-encode. I treat the values in my table as a working starting point, not a permanent specification.

Can I add a semi-transparent background box behind the captions for better readability?

Yes. Change BorderStyle=3 in the Style line. This replaces the outline mode with an opaque box behind each cue. Use BackColour=&H80000000 for a semi-transparent black box (the first two hex digits are the alpha channel: 80 = about 50% transparency). A background box makes text readable over any video content or platform UI element, which is why I use it on shots with busy or bright backgrounds.

My TikTok caption overlaps the creator description text. How do I fix it?

Push MarginV from 180 to 350. This moves the caption baseline 350px above the bottom edge, clearing TikTok's description text overlay (~340px measured). If you need the caption visible at the same time as a long description, a top-of-frame placement works well: change Alignment=8 and MarginV=100 in the Style line to place the default caption in the top-center of the frame, well above the navigation bar and completely clear of the description.

Official Sources

Written by Dao Huy (Lucas), Vietnamese translator & localization specialist (EN · ZH · FR → Vietnamese). See translation services →

报价WhatsApp