Output
Output will appear here
Click in the output to select all text
Open Graph (OG) Tag Generator for Social Sharing
Related tools
Twitter / X Card Meta Tag Generator
Generate summary and summary_large_image Twitter card meta tags for X/Twitter sharing.
Twitter cardTwitter meta
Featured
SEO Meta Tag Generator
Generate standard HTML meta tags, title, description, canonical, and robots tags.
Meta tagsSeo generator
Schema.org Structured Data Generator
Generate JSON-LD structured data for Article, Organization, Product, FAQ, Recipe, and LocalBusiness.
Schema orgStructured data
Canonical URL & Rel Tag Generator
Generate rel="canonical" and rel="alternate" language tags to prevent duplicate content.
Canonical urlRel canonical
SEO Content & Technical Audit Checklist
Run on-page SEO checks for title length, description length, headings, and readability.
Seo auditSeo checklist
The Open Graph Social Card Generator creates the og:title, og:description, og:image, and related tags that control how your page appears when shared on Facebook, LinkedIn, and Discord. Without them, social platforms guess at what to display, often pulling the wrong image or a messy snippet of body text. This tool is built for marketers preparing a campaign launch, content teams publishing new articles, and developers wiring up sharing metadata for a site, and it produces valid, spec-compliant Open Graph markup in seconds. Just fill in your title, description, image URL, and page type, and get copy-ready HTML tags formatted correctly for the head of your document. As with every tool on this platform, it works instantly and entirely inside your browser - no data upload, no signup, and no cost. Getting your og:image dimensions and og:type right dramatically improves click-through rates when your content is shared. Scroll down to start building your Open Graph tags now.
Features
- Generates og:title, og:description, og:image, og:url, and og:type
- Supports og:site_name and og:locale fields
- Guidance on recommended og:image dimensions (1200x630px)
- Covers Facebook, LinkedIn, and Discord preview rendering
- Live preview of how your social card will appear
- Instant copy-to-clipboard HTML output
- No signup, install, or server-side processing
Why use this open graph social card generator?
- Instant tag generation with no page reload delay
- Fully client-side - your URLs and copy stay private
- Produces spec-accurate Open Graph markup every time
- No coding needed - just fill in a simple form
- Completely free with unlimited generations
Frequently asked questions
What is the recommended og:image size?
Use 1200x630 pixels for the best rendering across Facebook, LinkedIn, and Discord, with an aspect ratio close to 1.91:1.
Why isn't my Open Graph image showing up on Facebook?
This usually happens because Facebook cached an old preview - use Facebook's Sharing Debugger to force a re-scrape after updating your tags.
Do I need both Open Graph and Twitter Card tags?
Yes, Twitter/X does not always fall back to Open Graph tags, so adding dedicated twitter: tags ensures consistent previews there too.
What is the difference between og:description and meta description?
The meta description appears in search results, while og:description is shown only in social share previews and can be written differently to suit sharing context.
Is og:type required?
It's recommended - use "website" for most pages or "article" for blog posts to help platforms render appropriate metadata.
Can I use a relative URL for og:image?
No, og:image must be an absolute URL including https:// so crawlers on other domains can fetch it.
How do I test my Open Graph tags?
Use Facebook's Sharing Debugger or LinkedIn's Post Inspector after publishing to confirm the tags render as expected.
From the blog
Twitter Cards vs Open Graph: Do You Need Both?
Twitter Cards vs Open Graph: X falls back to og: tags automatically, so you usually only need twitter:card. Here is exactly when overrides earn their place.
Open Graph Tags: The Five You Actually Need
Open Graph tags decide how your links look on social. The five og: tags that matter, correct og image size, and the mistakes that break previews.
Why Your Link Preview Image Isn't Showing
Link preview not showing? The seven real causes of a missing og:image — relative URLs, undersized files, caching, auth walls — and how to debug each one.