Blog & Guide

Crop Your Facebook Cover Photo for Mobile & Desktop Perfection

The Facebook Cover Photo is the most frustrating image on the internet to crop. Why? Because Facebook utilizes a "responsive" design. If someone looks at your profile on a laptop, the banner is extremely wide and short. If they look at it on a smartphone, the banner is much narrower and taller. A photo that looks perfect on a desktop will arbitrarily chop off your friends' heads on an iPhone. To win the Facebook cover game, you cannot just guess. You must crop a very specific "compromise" rectangle and understand exactly which edges Facebook is going to automatically amputate. This guide breaks down the exact 2026 mathematical safe zones for Facebook cropping.

Quick Answer

"To crop a Facebook Cover Photo perfectly: 1. You must understand the "Safe Zone". Desktop displays at 820x312 pixels (wide). Mobile displays at 640x360 pixels (taller). 2. Crop your original image to exactly 820x360 pixels. 3. Ensure all important text, logos, and faces are kept strictly in the absolute middle of the image. 4. Facebook will chop off the top and bottom on desktop, and the left and right on mobile. The center is the only safe area."

1

Create a new crop target of exactly 820 pixels wide by 360 pixels tall.

2

Position your main subject dead center in this rectangle.

3

Mentally slice off the top 24 pixels and bottom 24 pixels—this will be invisible on desktop.

4

Mentally slice off the left 90 pixels and right 90 pixels—this will be invisible on mobile.

5

Export and upload; your core content is now safe on all devices.

Before & After: The Text Cutoff

Before knowing the rules, a business owner creates an ad banner. They place the text "Call Us Today" in the top-left corner and the phone number in the top-right corner. It looks great on their PC. On a phone, it gets chopped to say "all Us Tod". After learning the rules, they re-crop the image, moving the text down and into the center safe zone. Now, the desktop cuts off empty sky, the phone cuts off empty trees, and the phone number is beautifully legible on all devices.

Why One Ratio Doesn't Work

Unlike Instagram or YouTube which use fixed aspect ratios, Facebook's cover photo is fluid. It has a 2.6:1 aspect ratio on desktop, and a 16:9 aspect ratio on mobile. Because you can only upload one photo, your crop must be a physical compromise (820x360) that can survive being dynamically chopped into two different ratios by the platform's code.

Recommended Ratios

DeviceDisplay Pixel SizeWhat Gets Cropped OffSafe Zone Strategy
Desktop Browser820 x 312 pxTop and Bottom edges removedKeep critical vertical data centered
Mobile App640 x 360 pxLeft and Right edges removedKeep critical horizontal data centered
Shared Post PreviewVaries wildlySides often heavily croppedUse PNG for text crispness

Why Compression Is Needed

Brand Consistency

If your business cover photo cuts off your logo on a mobile phone, to the 80% of users who primarily use mobile, your brand looks amateurish and careless.

Protecting Group Photos

If you upload a massive family reunion photo, the people standing on the ends of the line will be invisible to mobile users unless you factor in the safe zones while cropping.

Readability

Marketing event dates and webinar URLs placed on cover photos MUST sit entirely within the 640x312 safe zone, or they become functionally useless.

Ready to get started now?

Use our professional Crop Image tool for free.

Open Crop Image

What you're trying to achieve

Formatting business page banners and personal profile headers so that typography and faces are visible to both mobile app and desktop browser users.

Step-by-Step Guide

1

Step 1: The Master Canvas Crop

Do not use a standard 16:9 ratio. You need to crop your starting image to a "Lowest Common Denominator" size. Use a custom crop tool set to exactly 820 pixels wide by 360 pixels tall. This specific shape contains both the mobile and desktop viewing bounds.

2

Step 2: The Desktop Amputation

On a computer monitor, Facebook displays your cover at 820x312. This means it physically cuts 24 pixels off the top of your 820x360 crop, and 24 pixels off the bottom. Therefore, do not place text or heads near the absolute top or bottom borders of your photo.

3

Step 3: The Mobile Amputation

On a smartphone, Facebook displays your cover at 640x360. This means it physically cuts roughly 90 pixels off the extreme left side, and 90 pixels off the extreme right side. Therefore, do not place text or faces near the sides.

4

Step 4: The Center "Safe Zone"

By overlapping those two amputations, you are left with a "Safe Zone" in the dead center of the image. This box is roughly 640 pixels wide by 312 pixels tall. Drag your 820x360 crop box around your original photo until the most important elements (family, business logo, event text) sit perfectly within this center box.

5

Step 5: High-Quality PNG Export

Facebook applies aggressive, ugly compression to JPG cover photos. To prevent your text from looking blurry after you upload it, always export your perfectly cropped cover photo as a lossless PNG.

Target Size
Under 100KB is ideal according to FB, but PNG file type will protect quality over size
Dimensions
Master Canvas: 820x360 pixels
Format
PNG (Crucial for text clarity)

Common Mistakes + Fixes

Mistake: Putting the logo in the bottom left.
Fix: Not only does mobile crop the left edge, but on personal profiles, your circular Profile Picture overlaps the bottom left corner of your cover photo. NEVER put important text in the bottom left corner.
Mistake: Uploading a massive 4K photo.
Fix: If you upload a 4000x3000 photo without pre-cropping it, the Facebook algorithm will downsample it violently, resulting in a blurry cover photo. Feed Facebook exactly the pixels it needs (820x360).
Mistake: Using JPG for text graphics.
Fix: Facebook's compression algorithm destroys red colors and sharp text in JPGs. For graphical banners, always use PNG.

Ready to optimize your photos?

Use our professional Crop Image tool for free.

Open Crop Image

Best Recommended Settings

Crop Tool InputCustom Dimensions: 820 W x 360 H
Framing CheckMentally block out 90px on left/right and 24px on top/bottom
Final OutputHigh Quality PNG to bypass Facebook compression
Upload ScenarioDesktop User ViewMobile User View
Text placed on the Left EdgeFully VisibleCut off / Unreadable
Face placed near the Top EdgeScalped (head cut off)Fully Visible
Logo placed near Bottom LeftBlocked by Profile PicBlocked by Profile Pic & Screen Edge
All data in 640x312 CenterPerfectPerfect

Real-Life Use Cases

  • Formatting a graphic for an upcoming Church Event to ensure the Start Date is visible on phones.
  • Cropping a wide 16:9 landscape photo so the most interesting mountain peak sits in the un-croppable dead center.
  • Pre-formatting a real estate "Just Sold" banner so the agent's phone number avoids the profile picture overlap.
  • Generating a cohesive social media header that works across both Facebook Pages and Facebook Groups (which have slightly different crops).
  • Ensuring a promotional author banner doesn't cut off the title of their newly released book.

Frequently Asked Questions

Q. Does Facebook allow me to reposition the photo after I upload it?

Yes, Facebook allows you to "Drag to Reposition" vertically. However, you can ONLY drag vertically. If you placed your text too far to the left or right, a mobile phone will cut it off, and no amount of dragging will fix it. You must crop properly beforehand.

Q. Why did my cover photo become so blurry when I uploaded it?

Facebook applies a heavy compression algorithm to save server space. If your image was uploaded as a JPG, or if the file was over 100KB, it compresses it harder. Keep the file small, keep it exactly 820px wide, and save it as a PNG.

Q. Is the Group Cover Photo the same size?

No. Facebook Groups use a completely different aspect ratio (1.91:1) and recommend 1640x856 pixels. Only use the 820x360 dimensions for Personal Profiles and Business Pages.

Related Tools