Facebook Cover Photo Sizes: Desktop vs Mobile

The Mobile/Desktop Divide

Facebook cover photos present a unique design challenge: the same image must work across two very different display contexts. On desktop, your cover displays at 820 × 312 px. On smartphones, it is cropped to 640 × 360 px, centered. This means that anything sitting in the left or right 90 px of your desktop design will be hidden on mobile — and since over 80% of Facebook access is from mobile devices, designing only for desktop is a serious mistake.

Facebook also displays cover photos differently depending on whether a visitor is viewing your personal profile, a Page, or a group. The dimensions listed in this guide apply to personal profiles and Pages, which share the same specifications.

Exact Cover Photo Dimensions

• Desktop display: 820 × 312 px
• Mobile display: 640 × 360 px (centered crop of the desktop version)
• Recommended canvas size: 820 × 360 px (accommodates both displays)
• Minimum size to avoid stretching: 400 × 150 px
• Accepted formats: JPG, PNG

The 820 × 360 px recommendation comes from designing an image that satisfies both desktop (820 × 312 px) and mobile (640 × 360 px) by creating an overlap region. Think of it as: on desktop, the top and bottom 24 px are hidden; on mobile, the left and right 90 px are hidden. Your safe zone is the central 640 × 312 px area.

The Safe Zone Strategy

The safest approach is to keep all critical content — your brand name, tagline, call-to-action, and any face or focal point — within the central 640 × 312 px area. Treat the 820 × 360 px canvas as decorative space: background textures, gradients, and non-essential imagery can extend into this border area, but nothing you care about should live there.

Draw a guide at 90 px from each side edge, and another at 24 px from the top and bottom. Keep everything important inside the resulting rectangle. This sounds restrictive, but in practice it forces a cleaner, more focused design that often looks better on both platforms.

Profile Picture Overlap

On personal profiles, Facebook renders your profile picture in the bottom-left corner of your cover photo. The exact position shifts slightly across app versions, but generally the profile picture sits about 16 px from the left edge and overlaps the bottom of the cover by roughly 30%. This means the bottom-left area of your cover photo will always be partially obscured by your profile picture. Avoid placing text, logos, or important imagery in the bottom-left quadrant of your design.

Cover Photos for Facebook Pages

Facebook Pages behave slightly differently. The Page profile picture is smaller and positioned differently, but the same 90 px side-margin safe zone applies. For Pages, also note that the cover photo area includes space for the Page name and category below the image — this affects how your cover sits visually in the layout. Test your design by viewing a dummy Page in both desktop and mobile app states before finalizing.

Animation: Video Cover Photos

Facebook supports video cover photos for Pages. The recommended dimensions are 820 × 312 px at minimum, with 1250 × 463 px recommended for higher quality displays. Videos should be 20–90 seconds long, loop seamlessly, and be uploaded as MP4 or MOV. Video covers auto-play silently, so your visual message needs to work without sound. They appear only on desktop by default — mobile shows a static frame.

Practical Tips

• Upload at exactly 820 × 360 px to give Facebook the correct canvas without any resampling artifacts.
• Use PNG for covers with text or flat colors — JPEG compression creates visible artifacts on sharp edges at Facebook's display resolution.
• Preview your design in Facebook's actual interface before publishing, not just in your design app. Facebook adds a subtle shadow under the cover photo that can affect how light-colored designs look.
• Update your cover photo seasonally or for campaigns. A stale cover photo signals that the Page is inactive.

Common Mistakes

The most common mistake is uploading a 1920 × 1080 px image. Facebook scales this down for display, but the resampling often introduces subtle softness in text and logos. Always start at 820 × 360 px.

The second most common error is ignoring the mobile crop. A cover that says "Visit us at yourbrand.com" with the URL in the left or right 10% will have the URL cut off for most viewers. Keep your message in the safe zone.

Summary Checklist

• Canvas size: 820 × 360 px
• Safe zone: central 640 × 312 px
• Avoid bottom-left: profile picture overlap
• Format: PNG for text/graphics, JPG for photography
• Test on mobile before publishing