Open Graph Generator
Generate Open Graph and Twitter Card meta tags with a live social preview. Pick OG type (website, article, product, profile) and Twitter card style.
<meta property="og:type" content="website"> <!-- Twitter Card --> <meta name="twitter:card" content="summary_large_image">
settingsOptions
What is the Open Graph Generator?
Open Graph tags (<meta property="og:...">) tell Facebook, LinkedIn, Discord, Slack, iMessage, and most other apps how to render a link card when someone shares your URL: title, description, image, site name. Twitter Card tags do the same for Twitter/X. Without them, the platforms guess from the page content, often badly.
How to use the Open Graph Generator
- 1
Fill in the four core fields
Title (the headline on the card), description (the snippet under it), image URL (1200×630 ideal), page URL (the canonical link).
- 2
Add site name and pick OG type
Site name appears as a small label above the title ("Example Blog"). Type defaults to "website"; switch to "article" for blog posts, "product" for product pages, "profile" for user pages.
- 3
Pick a Twitter Card style
summary_large_image is the default and what most accounts want (big hero image). summary is the smaller card with image to the side, useful for short text-heavy posts.
- 4
Preview, then copy
The card on the page mimics how Facebook, LinkedIn, and similar platforms will render the link. Copy the meta tags and paste into the <head> of your HTML.
Frequently Asked Questions
What are Open Graph tags?
A small set of <meta property="og:*"> tags Facebook introduced in 2010 to standardize how social platforms render shared links. The four core ones are og:title, og:description, og:image, og:url. Most platforms (Facebook, LinkedIn, Discord, Slack, iMessage) parse them; Twitter has its own twitter:* set but falls back to OG tags when twitter:* is missing.
What image size works best for OG?
1200×630 pixels with a 1.91:1 aspect ratio. That's Facebook's recommended size and Twitter's summary_large_image standard. LinkedIn and Discord display the same dimensions cleanly. Smaller images (down to 600×315) still work but may look pixelated on retina screens. Keep file size under 5 MB.
Do I need both OG and Twitter tags?
Just OG tags is enough for most platforms. Twitter falls back to OG tags when twitter:* tags are missing, and Facebook ignores twitter:* entirely. Add twitter:* only if you want a different image or description on Twitter than on other platforms (rare). The generator emits both for completeness, but you can delete the twitter:* lines if you don't need the override.