How does the TikTok safe overlay work?
TikTok In-Feed ads sit inside the For You scroll, sharing real estate with native creator UI. The caption, profile and engagement rail can each cover 8โ22% of the viewport depending on caption state.
TikTok safe-overlay best practices
- Anchor your hook in the top-third of the frame, never the bottom where the caption lives.
- Burn captions into the video โ TikTok's auto-caption system is notoriously unpredictable and can overlap your CTA or key visual elements.
- Design for the expanded caption state, not the collapsed preview. If your caption is longer than two lines, it will cover a significantly larger portion of the bottom area.
- Use a 4โ6 word CTA โ anything longer gets ellipsised by the system button, losing its impact.
3 Common Creative Mistakes on TikTok
- Ignoring the "Right-Side Rail": Many designers forget that the "Like", "Comment", and "Share" icons aren't just small buttons; they are part of a vertical rail that consumes nearly 20% of the horizontal width on smaller devices.
- Text in the "Danger Zone": The bottom 25% of a TikTok ad is highly volatile. Between the username, the caption, and the music track name, any text placed here is likely to become unreadable.
- Mismatched Aspect Ratios: While TikTok supports 1:1 and 4:5, using anything other than a full-screen 9:16 vertical format results in "letterboxing," which reduces the immersive "native" feel that makes TikTok ads successful.
The TikTok Narrative Flow: The 3-Second Rule
TikTok is a sound-on, fast-paced environment. To maximize the effectiveness of your safe-overlay compliance, follow this narrative structure:
- 0-3 Seconds: The "Scroll Stopper." Ensure your most important visual hook is dead-center, avoiding all UI overlays.
- 3-10 Seconds: The "Value Prop." This is where you can use more of the screen, but keep text within the safe overlays.
- 10-15 Seconds: The "Direct Call to Action." Ensure your CTA button is clear and that no native UI elements (like the "Share" button) are obstructing it.
Technical Rendering Tips
For the best visual quality on TikTok, we recommend exporting your videos using the H.264 codec or HEVC. While HEVC offers better compression, H.264 remains the most compatible across the widest range of mobile devices. Aim for a bitrate of at least 15-20 Mbps for 1080p content to ensure that TikTok's own compression doesn't turn your gradients into "blocky" artifacts.
Frequently asked questions
What is the TikTok ad safe overlay? Keep critical text and logos within the central area: 15% from the top, 30% from the bottom, 4% from the left, and 16% from the right edge to clear all native UI.
Why is the right side margin so large? TikTok's engagement rail (like, comment, share, profile) lives flush to the right edge and consumes roughly 14โ16% of the horizontal viewport on every device.
Will captions cover my CTA? Yes. When users tap to expand the caption, it can occupy up to 35% of the bottom of the screen. Always design assuming the expanded state.