Facebook Design Sizes 2026 – Safe Zone, Padding & Photoshop Guide

Quick cheat sheet (TL;DR)

1) Profile picture (avatar)

Recommended: 400×400 px (min 180×180; max 2048×2048).

Aspect: 1:1 — shown as circle.

Padding: leave 20–40 px clear around subject so circle crop doesn’t cut important parts.

Preview sizes: thumbnail ~40×40 in comments, 170×170 on desktop, 128×128 on mobile.

2) Cover / Banner (Profile / Page / Group / Event)

General note: cover images display differently on desktop vs mobile. Keep main content inside center safe zone so nothing gets cut or hidden behind the profile avatar.

A. Personal profile cover

• Working canvas: 851×315 px (or double for retina).
• Visible safe area (mobile & desktop): ~820×312 px; many use 640×360 px as safe mobile width.
• Left padding: 150–200 px (profile avatar overlaps left side).
• Top / Bottom padding: 40–60 px.
• Save as: PNG for text/logo; JPG for photos.

B. Page (Business) cover

• Recommended: 851×312 px (or 1902×624 px for higher quality).
• Mobile safe zone: 640×312 px.
• Side safe padding: ~120 px left/right.

C. Group cover

• Recommended: 1640×856 px (min 820×461).
• Padding: top/bottom ~80 px; sides ~100 px.

D. Event cover

• Recommended: 1920×1005 px (16:9).
• Padding: top & bottom ~100 px; center your date/title.

Tip: design with a centered colored safe-zone overlay in your mock so you can quickly test crops across devices.

3) Feed/posts — single image sizes & padding

Square

1080×1080 px (1:1) — safest cross-platform.

Padding: keep ~80 px margin from each edge for text/logo.

Portrait (tall)

1080×1350 px (4:5) — grabs more screen on mobile.

Padding: top & bottom ~120 px; left/right ~80 px.

Landscape

1200×630 px (1.91:1) — good for link previews.

Padding: ~60 px margin.

Multiple photos: Facebook arranges layouts depending on number & orientation — avoid mixing orientations for predictable layouts. First image often decides layout.

4) Carousel (images + video ads)

Card size: 1080×1080 px (1:1).

Card padding: 60–80 px inside edges.

Max cards: 10. Keep important content away from edges — UI/controls & swipe gestures can overlap.

5) Stories / Reels (full screen vertical)

Canvas: 1080×1920 px (9:16).

Top & bottom no-text zone: keep ~14% (≈250 px) free of important text/CTA — UI (username, reply bar, CTA) often covers these areas.

Side padding: leave ~6% width from sides to avoid curved corners or notch overlap.

Place primary headline in the middle 50% vertical area for best visibility.

6) Video posts (Feed & Ads)

• Landscape: 1280×720 (16:9).
• Square: 1080×1080 (1:1).
• Vertical: 720×1280 (4:5) or 1080×1920 (9:16).

File type: MP4 (H.264). Frame rate: 24–30 fps. Bitrate: medium–high (for 1080p ~6–12 Mbps recommended); keep under platform limits.

Safe zones for text: keep ~200 px from top & bottom clear of essential text to avoid UI overlap.

Photoshop workflow: canvas setup, safe guides & export

Canvas & color

• Canvas resolution: use the recommended pixel dimensions (e.g., 1080×1920).
• Resolution (PPI): 72 ppi for web; optionally work at 2× for retina and scale down.
• Color mode/profile: RGB, sRGB IEC61966-2.1 (mandatory to avoid color shift).

Add guides / safe-zone overlays

• Add rectangle guides for exact safe zones (e.g., center 640×312 in a 851×315 cover).
• Stories/Reels: draw top & bottom guides at ~250 px to mark no-text zones.
• Use a semi-transparent layer to simulate crop on mobile/desktop.

Smart Objects & vectors

• Keep logos as vectors/Smart Objects so they remain crisp when resizing.
• Keep text layers editable (don't rasterize until final).

Sharpening & contrast

Minor sharpening after scaling down helps crispness (Unsharp Mask — low settings).

Avoid extreme filters before export; compression magnifies artifacts.

Export settings

1. Use File → Export → Export As or Save for Web (Legacy).
2. Photos: JPG, Quality 70–80%, Convert to sRGB, Progressive ON, Metadata None.
3. Graphics/text: PNG-24 if transparency or small text required.
4. WebP: good size/quality but Facebook may re-encode — JPG/PNG safest.
5. Retina: export at 2× dimensions if you want higher fidelity (watch file size).

Target file sizes (guideline): feed image 120–250 KB; cover 80–150 KB; story 150–250 KB; carousel 100–180 KB. Video short clips aim under 10–50 MB depending on length.

Practical padding rule-of-thumb (copyable lines)

• Profile picture: 20–40 px internal margin.
• Cover (profile/page): left 150–200 px, sides 120 px, top/bottom 40–100 px.
• Group cover: sides 100 px, top/bottom 80 px.
• Event cover: top/bottom 100 px.
• Feed (square): 80 px margin from edges.
• Feed (portrait): top/bottom 120 px; left/right 80 px.
• Carousel: 60–80 px internal gap.
• Stories/Reels: top & bottom 250 px no-text; side 6%.

Device visibility cheat

Mobile shows less horizontal space than desktop → design for mobile-first or keep essentials centered. Tablet is between mobile & desktop. Desktop shows extra side areas — but prioritize mobile.

Reels vs Stories — UI spaces to avoid

Top status & bottom action bar take ~14% of vertical space (≈250 px on 1080×1920). On Reels, CTA and social elements can occupy left/right bottom areas — avoid placing critical text there.

Common beginner mistakes & how to avoid them

• Placing text near edges → gets cut. Use safe margins.
• Wrong color profile → always export sRGB.
• Tiny fonts → Facebook compression reduces legibility. Use larger sizes (≥16–18 px body; 48–60 px for Stories headlines).
• Uploading mixed aspect images in one post → unpredictable collage layout. Keep orientation consistent.

Example: Cover design checklist (copy into Photoshop)

1. New canvas: 851×315 px (or 1902×624 for retina).
2. Set color profile: sRGB.
3. Add center safe zone guide: 640×312 px (centered).
4. Mark left profile overlap: left 170 px protected area.
5. Put logo/text within center rectangle; keep headline inside center 60% width.
6. Export: PNG (if text/logo) or JPG 80% if photo.