A mockup that looks perfect in the editor can arrive on the timeline with the phone's top third amputated. Every network crops to its own aspect ratio, and the crop happens after you post. The fix is boring and reliable: export at each platform's native ratio, and keep the device inside a safe area. Here are the numbers for 2026.
The cheat sheet
| Platform | Placement | Export size | Aspect ratio |
|---|---|---|---|
| X (Twitter) | Timeline image | 1600 × 900 | 16:9 |
| X (Twitter) | Link card (OG) | 1200 × 628 | 1.91:1 |
| Feed image | 1200 × 627 | 1.91:1 | |
| Feed portrait | 1080 × 1350 | 4:5 | |
| Stories / Reels cover | 1080 × 1920 | 9:16 | |
| Dribbble | Shot | 1600 × 1200 (or 2800 × 2100 HiDPI) | 4:3 |
| Product Hunt | Gallery image | 1270 × 760 | ~5:3 |
| YouTube | Thumbnail | 1280 × 720 | 16:9 |
| Open Graph | Any link preview | 1200 × 630 | 1.91:1 |
If you only export one landscape master, make it 1200 × 630 — the Open Graph size. It renders acceptably on X, LinkedIn, Slack, Discord, and iMessage link previews, which is where most B2B mockups actually get seen.
Safe areas: why devices get decapitated
Feed algorithms crop from the edges inward, and preview thumbnails crop harder than expanded views. Keep the device inside the central 80% of the canvas — roughly a 10% margin on every side. For 9:16 Stories, keep the top and bottom 250 px clear: that's where usernames, captions, and reply bars overlay your image.
Portrait beats landscape on mobile feeds
Instagram's 4:5 portrait format occupies about 30% more screen height than a 16:9 landscape image in the same feed — and a phone mockup is itself portrait, so the formats agree. On X and LinkedIn, landscape remains the default, so a tilted or angled phone fills the frame better than an upright one. Match the device orientation to the canvas: upright phone for portrait posts, angled phone or laptop for landscape.
One design, five exports
- 01Compose your mockup scene with the device centred and generous background margins.
- 02Export the OG master at 1200 × 630 for link previews and your blog post.
- 03Re-crop to 1080 × 1350 for Instagram — the margins you left absorb the ratio change.
- 04Re-crop to 1600 × 1200 for Dribbble; the 4:3 frame is closest to your editor view.
- 05Export a 9:16 vertical for Stories, moving the device to the centre band away from the UI overlays.
MochiMockup renders at 2K on the free tier, which covers every size in the table above — the largest, Dribbble HiDPI at 2800 px wide, is the only one that benefits from a 4K Pro export.