PNGifier

Best Image Format for Open Graph Images

An Open Graph image is the preview card people see when your link is shared. The best format depends on the card: JPG for photographic designs because the file stays small, PNG when the card is text and logo that must read crisply. Either way, build it at 1200x630, keep it light, and reference it with an absolute URL.

By Published

Choose your format by card type

There is no universal winner for og:image; the right format follows the artwork. A card built around a photograph, a screenshot with gradients or a rich illustration compresses beautifully as JPG and stays small. A card that is a bold headline, a wordmark or flat brand colour should be PNG so the text edges stay razor sharp. The table summarises the call.

Card designBest format
Photo or screenshot backgroundJPG
Headline text on flat colourPNG
Logo or wordmark cardPNG
Mixed photo plus small textJPG at high quality

Why 1200x630 is the size to design at

Facebook, LinkedIn and X all render the large share card at a 1.91:1 aspect ratio, and the recommended pixel size is 1200x630. Designing at exactly that size means the platform crops nothing important and your headline never gets chopped. Going larger wastes bytes; going much smaller produces a soft, downscaled-looking card. If your artwork started at another size, you can resize a PNG to 1200x630 before you export or convert it.

PNG vs JPG for the card itself

The two formats fail in opposite ways. PNG keeps every pixel exact, so text and logos are flawless, but a full-bleed photo saved as PNG can balloon to several megabytes. JPG crushes a photograph to a tiny file, but its lossy compression leaves faint ringing around sharp letters that is visible on a text-heavy card. The decision is simple: photographic content favours JPG, crisp graphic content favours PNG. If you designed a text card as PNG but it is too heavy, you can convert PNG to JPG and judge whether the text still reads cleanly.

Keep the file light for crawlers

Share crawlers fetch your image on a tight budget. Files approaching the 5 to 8 MB range are often skipped or downscaled, and even a large valid file slows the unfurl that decides whether your link looks appealing in a feed. Aim well under a megabyte — a properly optimised card usually lands far below that. After exporting, run it through a PNG compressor to shave size without visibly hurting quality, and verify the saved file before you ship the tag.

Transparency, URLs and Twitter/X

Three things trip people up. First, transparency is pointless here: the platform composites your card onto its own background, so any transparent pixels just become a colour you did not pick — design on a solid background. Second, the og:image value must be an absolute https URL, because the crawler has no page context to resolve a relative path. Third, X reads the same image but wants twitter:card set to summary_large_image to show the big 1200x630 version rather than a small thumbnail. Get those right and your card renders everywhere. For more file prep, browse all PNG tools.

Frequently asked questions

What size should an og:image be?
1200x630 pixels, a 1.91:1 ratio. This is what Facebook, LinkedIn and X all crop to for a large summary card, so designing at that exact size means no surprise cropping of your headline or logo.
PNG or JPG for an Open Graph image?
Use JPG for photographic or richly shaded cards because it is far smaller, and PNG when the card is mostly text, a logo or flat colour that must stay perfectly crisp. Match the format to the artwork, not to a habit.
Does an Open Graph image need transparency?
No. Social platforms always composite the card onto their own background, so any transparent area is simply filled with a colour you did not choose. Design on a solid background and you never need a transparent PNG here.
How small does the file have to be?
Keep it comfortably under a few megabytes — many crawlers skip or downscale images near the 5 to 8 MB range, and a heavy file slows the unfurl. A well-optimised JPG card is usually well under 500 KB.
Why is my share image not showing up?
The most common cause is a relative URL. The og:image tag must point to a full absolute https URL, because the crawler fetches it without your page context. A blocked path or a file that is too large are the next usual suspects.