Create Your Open Graph Image for Link Previews

Create an open graph image at 1200×630 for Facebook, LinkedIn, and X. Free templates and download.

Choose a template

Template Properties
Customize your image by changing the properties.
Background
Set a custom background for your image.
Gradient Direction
Grid Overlay
0.15
Preview
Save Image
Export the image as a PNG, JPEG or WebP.

For optimal Open Graph (OG) Image display on social media platforms like Twitter, Facebook, and LinkedIn, use PNG (recommended), JPEG or WebP format.

What is

An open graph image is the visual that appears in a link preview card when someone shares your URL on Facebook, LinkedIn, X, Discord, or any platform that supports the Open Graph protocol. Introduced by Facebook in 2010, the Open Graph protocol lets web pages become rich objects in social graphs—your open graph image is the most visible part of that metadata. It is set using the og:image meta property inside your HTML head, typically alongside og:title and og:description. Twitter Cards use a similar system: the twitter:image tag serves the same role, and most platforms will fall back to og:image if twitter:image is not present. A well-crafted open graph image gives viewers an instant visual summary of your content before they click, making it one of the most important pieces of social metadata on any web page.

What Is an OG Image?

Learn what an og image is, why link previews need it, and how to create one.

How to Use Open Graph

Complete guide to open graph tags, tools, and a 1200×630 checklist.

Open graph image on different platforms

Each social platform renders your open graph image slightly differently. Facebook displays the full 1200×630 open graph image in a large link preview card, while LinkedIn shows a similar card but may crop more aggressively on mobile. X (Twitter) uses a 16:9 ratio for its summary_large_image card, which can trim the top and bottom of a standard open graph image. Discord and Slack render a smaller thumbnail version of the open graph image, so keeping important content centered ensures readability across all platforms.

How to

  1. Design your open graph image in the editor using a template or custom layout that matches your brand. Choose colors, fonts, and a layout that will be legible at both full size and thumbnail scale.
  2. Export your open graph image at 1200×630 pixels, which is the standard dimension supported by Facebook, LinkedIn, Discord, and most social platforms.
  3. Host the exported file on a publicly accessible HTTPS URL so that social crawlers can fetch your open graph image without authentication issues.
  4. Add the open graph meta tags to your HTML head—include og:image, og:title, og:description, and optionally og:image:width and og:image:height pointing to your image URL.
  5. Preview your open graph image with our URL debugger to confirm that Facebook, X, and LinkedIn all render the correct image and text before you share the link publicly.

Why

Controlling your open graph image prevents platforms from picking random images from your page to represent your content in social feeds. Studies show that links with a proper open graph image receive 2–3× higher click-through rates than those without one. Without an open graph image, social platforms may display an irrelevant photo, a cropped screenshot, or no image at all—making your link easy to scroll past. A consistent open graph image also reinforces brand recognition every time your content is shared across social networks.

FAQ