Social Image Specs: Avatars, Covers and Feed Sizes
Image platforms crop more aggressively than video platforms: circular avatars, banner covers, another crop in the feed. Reverse-engineer sizes from display position and compose inside the safe area before uploading.
Reverse-engineer sizes from display position
Avatars are circular crops: centered composition is the floor — subject in the middle, margin on all four sides, square 400x400 or larger for clarity. Banner covers (article headers, channel art) have fixed ratios with both ends potentially cropped: keep titles and key content in the central safe zone.
Feed images (posts, timelines) follow each platform optimal ratio: square 1:1 or vertical 3:4 covers the widest range. In multi-image posts the first image sets the impression — lead with the most information-dense frame.
Three preprocessing steps
Scale to target width: display width is fixed, so 4000-pixel originals serve nothing — land in the 1080-to-2000 range. Scaling also lowers the chance of visible platform re-compression. Proportional scaling never distorts composition.
Compress to sensible size: quality 0.82 is the universal sweet spot; screenshots tolerate less. Watch transparency: chat pipelines convert PNG to JPG, so ship transparent assets as files. Finally confirm formats: JPEG for photos, PNG for transparency, WebP for the general case.
Acceptance: send it to yourself
Every spec is finally verified in the real display: send the processed image to yourself and view it in the target context — avatar in its circle, cover with its end-crops, feed image as a thumbnail.
Fix crop problems at the source: adjust composition and re-export rather than fighting the platform cropper. Keep the size guide as a checklist — the next batch scales and compresses by the same numbers, forever consistent.