# Social media safe zones: where the app covers your design

[Canonical HTML page](https://gradiently.design/guide/social-media-safe-zones)

Every platform paints buttons, names and captions over the top of your design. This is a single reference for where they land, with margins you can build into every template.

## The short version

- Social media safe zones are the areas of a design that the app's own interface never covers, on any phone.
- On a 1080×1920 vertical frame, a common working rule is to keep text out of roughly the top 250 pixels and the bottom 250 pixels of a story.
- Reels, TikTok and YouTube Shorts carry a caption along the bottom and buttons down the right side, so they need a deeper bottom margin and a right margin too.
- Banners have their own covered zones: the profile photo overlaps the lower left of LinkedIn and X headers, and phones crop the sides of Facebook covers.
- Interfaces change with app updates and differ between phones, so treat any safe zone figure as a generous guide and check by posting privately first.

**Social media safe zones** are the parts of a post that no app interface ever covers. On vertical formats the danger is the top, where names and progress bars sit, the bottom, where captions and reply fields sit, and on Reels, TikTok and Shorts the right edge, where the like and share buttons run. Let the background fill the whole frame, and keep every word, logo and face inside the safe area.

## Safe zones for vertical video and stories

All of these formats share the 1080×1920 frame, but the overlays differ. The figures below are working margins, rounded up on purpose, drawn from how each app lays out its interface and from the guidance platforms give advertisers. They are not official measurements, and every app shifts things between versions and screen shapes.

| Format | Top | Bottom | Sides |
| --- | --- | --- | --- |
| Instagram Story | 250 px | 250 px | About 60 px each side |
| Facebook and WhatsApp stories | 250 px | 250 px | About 60 px each side |
| Instagram Reel | 250 px | About 420 px | About 120 px on the right |
| TikTok | About 150 px | About 480 px | About 140 px on the right |
| YouTube Shorts | About 150 px | About 420 px | About 140 px on the right |
| Snapchat story | About 250 px | About 300 px | About 60 px each side |

Working margins on a 1080×1920 frame. Generous on purpose: the cost of being too careful is a little empty space, the cost of being careless is a hidden headline.

If you only remember one rule, make it this: on any vertical video, keep the important content inside a central box roughly 800 pixels wide and 1,150 pixels tall, starting about 250 pixels from the top. That box clears every margin in the table. More detail per platform lives in [Instagram Story size](https://gradiently.design/guide/instagram-story-size), [TikTok cover size](https://gradiently.design/guide/tiktok-cover-size) and [YouTube Shorts cover size](https://gradiently.design/guide/youtube-shorts-cover-size).

- Full frame 1080×1920: 1080 × 1920
- Safe on every app 800×1150: 800 × 1150
- Grid crop 1080×1440: 1080 × 1440

The full vertical frame, the box that is safe everywhere, and the 3:4 slice Instagram shows in the profile grid. Plan for all three at once.

## What sits in each zone

Knowing what covers each edge helps you decide what can go near it. Backgrounds, textures and the tail of a gradient are fine under the interface. Words, prices, logos and faces are not.

### Top and bottom of a story

- Progress bar and profile photo
- Account name and posting time
- Close and menu buttons
- Reply field and share button
- Link stickers you add in the app

### Bottom and right of a Reel or TikTok

- Caption, which grows when tapped
- Account name and follow button
- Audio or sound label
- Like, comment, share and save buttons
- Navigation bar of the app itself

The caption is the sneaky one. A short caption takes two lines, but when a viewer taps it, it expands upwards over the video. If your text sits low in the frame, a long caption will cover it.

A vertical post with its headline in the upper middle of the frame, well clear of the edges

Words in the safe box, roughly in the upper middle. Nothing important near the bottom or right.

A vertical post with a short list kept to the left and centre of the frame

A list layout held to the left and centre, leaving the right edge free for the app's buttons.

## Safe zones on banners and headers

Wide banners don't have buttons on top, but they have two other problems: a profile photo that overlaps part of the image, and different crops on phones and desktops.

| Banner | Size | Keep clear |
| --- | --- | --- |
| LinkedIn profile banner | 1584×396 | Lower left, where the profile photo sits |
| X header | 1500×500 | Lower left, and the top and bottom edges |
| Facebook cover | 1640×624 | Outer sides on phones, and the bottom band |
| YouTube channel art | 2560×1440 | Everything outside the central strip shown on all devices |
| LinkedIn company cover | 2256×382 | Lower left, where the company logo sits |

Banners are mostly background. Put words in the centre and right, away from the avatar.

YouTube is the extreme case: channel art is a huge 2560×1440 image, but phones show only a narrow strip from the middle. Our guides to the [LinkedIn banner](https://gradiently.design/guide/linkedin-banner-size) and [YouTube banner](https://gradiently.design/guide/youtube-banner-size) map the exact areas.

## Feed posts and thumbnails have safe zones too

- **Instagram profile grid:** posts appear as 3:4 tiles cut from the centre. A 1080×1350 post loses a sliver from each side; a Reel cover loses about 240 pixels top and bottom. See [Instagram grid crop](https://gradiently.design/guide/instagram-profile-grid-crop).
- **YouTube thumbnails:** the video length sits in the bottom right corner, so keep faces and words out of it.
- **Carousels:** the dots sit just under the image, but some apps overlay a slide counter in the top right corner.
- **Pinterest pins:** save buttons and the pin title appear on hover and under the pin, so leave the lower edge calm.

## How to build safe zones into your workflow

1. **Make a guide layer once** In each template, draw the safe box as a locked guide layer. Keep it visible while you design and hide it before you export.
2. **Design for the strictest platform** If one vertical design will go to Stories, Reels and TikTok, use TikTok's margins. It is then safe everywhere.
3. **Let the background bleed** The covered zones still show your background. Run colour and texture to every edge so the frame never looks boxed in.
4. **Leave a sticker gap** If you will add a link or poll sticker in the app, leave an empty area in the lower middle of the safe box.
5. **Preview with the interface on** Post to a private or close friends audience, or save a draft and view it full screen. That is the only true check.

Gradiently helps on two fronts. When you resize one design to other formats with Pro, each copy is laid out again for its shape instead of cropped, so you only nudge the words into the safe box. The Mark behind it fills the whole frame, interface zones included, and keeps its calmest, best contrasting area behind your words wherever they move. [Text on a gradient](https://gradiently.design/guide/text-on-gradient) covers the legibility side in detail.

## FAQ

### What are social media safe zones?

They are the parts of a post that no app interface covers. Text, logos and faces belong inside them; backgrounds can run beyond them.

### What is the safe zone for Instagram Reels?

As a working rule on a 1080×1920 frame, keep text out of the top 250 pixels, the bottom 420 pixels and the right 120 pixels, where the caption and buttons sit.

### What is the TikTok safe zone?

TikTok covers the bottom with the caption and sound label and the right with its buttons. Keeping text out of roughly the bottom 480 pixels and right 140 pixels of a 1080×1920 frame is a safe guide.

### Is there one safe zone that works on every vertical platform?

Yes, roughly. A central box about 800 pixels wide and 1,150 pixels tall, starting about 250 pixels from the top of a 1080×1920 frame, stays clear on Stories, Reels, TikTok and Shorts.

### Do safe zones change?

Yes. Apps redesign their interfaces and phones differ in shape, so treat any figures as generous guides and preview each post with the interface showing.
