TikTok Ad Preview Tool
Upload your creative and see an approximate mockup of how your ad could appear in the TikTok For You feed or as a TopView takeover. Free, no signup required.
Ad Settings
Drop your file here
or click to browse
JPG, PNG, WebP, MP4, MOV · 9:16 recommended
The sample is a gradient with text drawn locally in your browser, so you can try the tool without uploading anything.
Focal position moves the crop when using Fill. Fit keeps the whole creative visible with black padding.
Shades the right action column and the bottom caption/CTA area this mockup uses. UI and available space vary by device, app version and placement. Confirm in TikTok Ads Manager.
Locally rendered review mockup, not an exact platform screenshot. Video exports the current paused frame as a still PNG. Guides are included when enabled.
Upload a creative or load the sample
Approximate mockup of TikTok’s layout. Engagement counts are placeholders. Actual UI, fonts and spacing vary by device and app version.
Smash performance ceilings. Scale profitably with AI-powered, creative-led growth.
Creative strategy, production and testing for the fastest-growing products in the world.
RocketShip HQ’s AI-powered performance creative teams run thousands of creative experiments every month to find your next winners, so you can scale profitably and sustainably.
Book your free strategy call“As one of the top-spending advertisers on TikTok, we have a high bar for great creatives, and Rocketship delivered on both production and performance. We thoroughly enjoyed working with the team, as they communicated strategy clearly, shared detailed briefs, and were generally very open and collaborative.”
Eva JuretićGrowth Marketer, Highrise“… grew our UA spends from zero to 7 figures, helped our DAUs grow 7x – and get acquired by a public company”
Jeb BaliseCEO, DropFitnessFormer General Manager at Zynga & former CEO at PuzzleSocial
Why Use a TikTok Ad Preview Tool?
Catch Issues Early
See an approximate mockup of how your creative sits behind TikTok’s interface before spending a single dollar. Spot caption cutoff, awkward cropping and elements hidden by the action column.
Faster Approvals
Download an approximate PNG mockup to share with clients and stakeholders instead of describing what the ad “will look like.”
Compare Before Launch
Try different captions, CTAs, crops and creatives in the same frame. Refine your opening frame and copy before committing budget to a campaign.
Stays in Your Browser
Your creatives are never uploaded to a server. Previews, the sample creative and the PNG export are all rendered locally in your browser.
How It Works
Upload Your Creative
Drag and drop an image or video file into the upload area, or load the locally generated sample. Choose the For You feed or TopView format and set Fill or Fit cropping.
Enter Your Ad Copy
Add your brand name, caption, CTA button type and optional music/sound text. The feedback line shows character counts against the thresholds this mockup uses.
Check, Export and Iterate
Turn on the approximate safe-zone guide, adjust copy and crop until you are happy with it, then download a PNG mockup to share. Confirm the final rendering in TikTok Ads Manager.
Why Preview Your TikTok Ads Before Publishing?
The For You feed is an endless scroll of native-feeling content, and your ad needs to blend in visually while still standing out enough to stop the thumb. That makes the creative itself, and how it sits behind TikTok’s interface, the main thing you control.
The gap between what you see in your editing software and what users experience in-feed is often larger than expected. Text that looks well sized on a desktop monitor may be hard to read on a phone screen. A caption that fits comfortably in a text editor can be shortened behind a “…more” link. A vertical video that looked great in your asset library could have key visual elements covered by TikTok’s UI overlays (the action buttons on the right, the caption area at the bottom, and the navigation bar).
Previewing your TikTok ads in an approximate mockup before uploading them to TikTok Ads Manager lets you catch these issues at zero cost. You can check that your creative works within a layout like TikTok’s, test multiple caption variations quickly, and share mockups with clients or team members for faster alignment. The final check still belongs in Ads Manager’s own preview.
This matters most for performance marketing teams producing many creative variations per week, where a few minutes spent previewing each one can prevent spend on creatives that do not render as intended.
TikTok Ad Specifications
Getting the technical specifications right is the foundation of any TikTok ad. The table below lists commonly cited guidance for TikTok In-Feed ads. TikTok changes its limits from time to time, so check the platform’s current spec in TikTok Ads Manager before you build or upload.
| Specification | Commonly cited guidance |
|---|---|
| Aspect Ratio | 9:16 vertical recommended; 1:1 and 16:9 are also accepted |
| Resolution | 1080 x 1920 px recommended for 9:16 |
| Video Duration | Short vertical video; check TikTok’s current minimum and maximum |
| File Size | Check TikTok’s current limit for your upload route |
| File Formats | .mp4 and .mov are widely supported; check the current list |
| Image Formats | .jpg, .jpeg, .png for image-based placements |
| Brand Name | Short; this mockup’s input accepts up to 30 characters |
| Ad Caption | Keep the key message early; this mockup shortens the caption after 80 characters |
Safe Zones to Keep in Mind
TikTok’s interface elements overlay the edges of your creative. Key information (faces, text, product shots) should be placed within the centre of the frame to avoid being hidden behind:
- Top edge: the “Following | For You” tabs and the Sponsored label in the feed; a smaller ad label in TopView
- Bottom edge: brand name, caption, music ticker, CTA button and, in the feed, the navigation bar
- Right edge: profile picture and the like, comment, bookmark and share action column
The “Show approximate safe-zone guide” checkbox shades these areas as this mockup draws them. The exact pixels vary by device, app version and caption length, so treat the guide as a planning aid and confirm with the safe-zone preview in TikTok Ads Manager.
TikTok Creative Best Practices
Understanding the specifications is only half the equation. The other half is knowing what tends to work on TikTok. These are common practices worth testing against your own results.
Hook Within the First Second
TikTok users scroll fast. Your ad appears between organic content from creators they follow, so the opening frame needs to create immediate visual interest or an open loop that makes the viewer want to see what comes next. Common hook formats include a surprising visual transformation, a bold text overlay with a provocative question, or a close-up of a product in use.
Embrace the Native Format
Ads that feel like organic content are a common starting point on TikTok, because overly polished, commercial-looking creative is easy for users to recognise and skip. Shoot with a phone, consider trending audio, include text overlays in native-looking styles, and let the content feel authentic rather than produced. Test this against more produced creative rather than assuming it.
Use Text Overlays Strategically
Some viewers watch with sound off. Text overlays help your message land regardless of audio state. Place your primary text overlay in the upper-centre portion of the screen, away from the shaded areas in the guide, and keep it large enough to be legible on smaller devices. Use high-contrast colours against your background.
Test Multiple CTAs
TikTok offers several CTA button options, including Learn More, Shop Now, Download, Sign Up and Play Game. The right CTA depends on your campaign objective and audience, and only your own results can tell you which one converts best. Use this preview tool to see how different CTAs look in context before committing to one.
Keep It Short
Short creatives are easier to watch to the end. If your message requires more time, front-load the most compelling content in the first few seconds and check your own completion rates in Ads Manager to find the length that works for your audience.
Leverage Vertical Framing
Shoot and design for 9:16 vertical. While TikTok also accepts 1:1 and 16:9, those formats leave bars or unused screen space. A full-bleed 9:16 creative uses the entire screen and matches the organic content around it. Use the Fit option in this tool to see how a non-vertical asset sits inside the frame.
Pre-Launch TikTok Creative Checks
Before uploading your creative to TikTok Ads Manager, run through this checklist to catch common issues that waste budget.
- Safe zone compliance: Is all critical text and imagery clear of the action column and the bottom caption area? Turn on the approximate guide in this tool, then confirm in Ads Manager.
- Caption length: Is your key message in the first part of the caption? This mockup shortens captions after 80 characters with a “…more” link; actual platform truncation varies by device.
- Brand name display: Does your brand name read well in the small overlay text? Long brand names may be clipped.
- CTA clarity: Does the CTA button text match your campaign goal and what the landing page delivers?
- Audio hook: This mockup plays video muted. Check separately that the first audio beat supports the opening visual.
- Video resolution: Low-resolution assets look noticeably worse in the feed. Export at 1080 x 1920 where you can.
- Aspect ratio: Confirm 9:16 full-screen. Use Fit in this tool to see where other ratios leave bars.
- Landing page alignment: The creative, caption and landing page should tell one cohesive story. If your ad promises a discount, the landing page must show that discount immediately.
Frequently Asked Questions
Is this TikTok ad preview tool really free?
Yes, completely free with no usage limits, no signup required, and no watermarks. Your files stay in your browser and are never uploaded to a server. Use it as many times as you need.
Does this tool support video creatives?
Yes. You can upload MP4 or MOV video files and they play muted on loop inside the mockup, giving you an approximate sense of how the ad looks in motion behind the interface. The PNG export uses the current paused frame.
What is the recommended size for TikTok In-Feed ads?
1080 x 1920 pixels (9:16) is the commonly recommended size. TikTok also accepts 1:1 and 16:9, but 9:16 fills the whole screen without bars. Check TikTok’s current spec before uploading.
Can I preview TikTok Spark Ads or TopView with this tool?
The For You feed format approximates the standard In-Feed layout, which Spark Ads also use: the action column, caption area and CTA sit in the same places, with the creative coming from an existing organic post. The TopView format approximates a full-screen takeover with smaller interface elements and no navigation bar. Both are approximate mockups; confirm in TikTok Ads Manager.
How long should my TikTok ad be?
There is no single right length. Shorter creatives are easier to watch to the end, so front-load your hook and key message in the first few seconds, then compare completion rates for different lengths in your own account. Check TikTok’s current minimum and maximum duration before uploading.
Why does my ad caption get cut off?
TikTok shortens longer captions in the feed behind a “…more” link. This mockup shortens the caption after 80 characters; the actual cutoff varies by device, font size and caption content. Keep your most important message at the start of the caption.
What CTA buttons are available on TikTok?
TikTok offers several CTA options including Learn More, Shop Now, Download, Sign Up, Play Game and Contact Us, and the list changes over time. The best CTA depends on your campaign objective and your own test results.
Does the preview look the same on all devices?
No. This is an approximate mockup of TikTok’s layout, not a screenshot of the app. Fonts, spacing, safe zones and the position of interface elements vary by device, app version and caption length. Use it to catch obvious problems, then confirm the final rendering in TikTok Ads Manager.
