Generate Open Graph and Twitter Card meta tags instantly. Preview how your content looks when shared on social media. Free, no sign-up required.
The title that appears in social share previews. Keep it under 60 characters.
Your website or brand name. Optional but recommended.
A concise summary shown below the title. Keep it under 155 characters.
The canonical URL of the page being shared.
Recommended: 1200 x 630 pixels. Must be an absolute URL.
The type of content. "website" is the most common default.
"summary_large_image" shows a large image preview. "summary" shows a smaller thumbnail.
Other free tools to help you optimize and grow.
Paste your content and check keyword density instantly. Optimize without over-stuffing.
Use Tool \u2192Analyze your content readability with Flesch Reading Ease and grade-level scores.
Use Tool \u2192Check if your page title fits Google SERP limits and preview how it looks in search results.
Use Tool \u2192Generate SEO-optimized meta tags for your pages with title, description, and robots directives.
Use Tool \u2192Create valid FAQ structured data (JSON-LD) to earn rich results in Google search.
Use Tool \u2192How It Works
No account needed, no sign-up required. Completely free. Fill in your page details, preview the social share card, and copy the generated meta tags.
Fill in the OG title, description, page URL, image URL, site name, and select your OG type and Twitter card type. The more fields you complete, the better your social share previews will look.
See a live preview of how your page will appear when shared on Facebook, LinkedIn, and Twitter. Check that the title, description, and image look right before copying the code.
Click Copy to Clipboard and paste the generated meta tags into the head section of your HTML page. No sign-up required. Completely free.
What Are Open Graph Tags
Open Graph (OG) tags are HTML meta tags that tell social media platforms what title, description, image, and URL to display when someone shares your page. Without them, platforms guess what to show.
OG Tag Example
<meta property="og:title" content="Your Page Title" /> <meta property="og:description" content="Your description here" /> <meta property="og:image" content="https://example.com/image.jpg" /> <meta property="og:url" content="https://example.com/page" /> <meta property="og:type" content="website" />
Place these tags inside the head section of your HTML
Open Graph was introduced by Facebook in 2010 as a protocol for web pages to become rich objects in a social graph. Today, nearly every social platform supports OG tags, including LinkedIn, Twitter, Pinterest, WhatsApp, Slack, and Discord.
When someone shares a link, the platform crawler visits the URL and reads the OG meta tags from the HTML head. It then uses those values to build the share preview card. If no OG tags are found, the platform attempts to infer a title and description from the page content, which often produces poor results.
Properly configured OG tags give you complete control over your brand appearance on social media. This free tool generates both Open Graph tags (for Facebook, LinkedIn, and most platforms) and Twitter Card tags (for Twitter/X) in a single step.
The most important OG properties are og:title, og:description, og:image, and og:url. Together they create the preview card that determines whether someone clicks your link or scrolls past it.
OG Properties
Use this table to understand each OG property, whether it is required, and what it controls in the social share preview.
| Property | Required | Description |
|---|---|---|
| og:title | Required | The title of your page as it appears in share previews. Keep it concise and compelling, under 60 characters for best display. |
| og:description | Required | A brief summary of your page content. Shows below the title in share previews. Keep it under 155 characters. |
| og:image | Required | The image displayed in the share preview card. Use an absolute URL. Recommended minimum size: 1200 x 630 pixels. |
| og:url | Required | The canonical URL of the page. This tells social platforms which URL to associate with the shared content. |
| og:type | Optional | The type of content (website, article, product, profile). Defaults to "website" if not specified. |
| og:site_name | Optional | The name of your website or brand. Appears above or near the title in some platform previews. |
Based on the Open Graph protocol specification and platform documentation, 2026.
OG Image Specs
Each social platform has its own preferred image dimensions. Use these specs to create images that display perfectly everywhere your content is shared.
| Platform | Recommended Size | Aspect Ratio | Notes |
|---|---|---|---|
| 1200 x 630 px | 1.91:1 | Minimum 600 x 315 px. Images smaller than 200 x 200 px will not display. | |
| 1200 x 600 px | 2:1 | For summary_large_image cards. Summary cards use 144 x 144 px minimum. | |
| 1200 x 627 px | 1.91:1 | Minimum 200 x 200 px. Larger images get better engagement in feeds. | |
| 400 x 400 px | 1:1 | Square images work best. Falls back to og:image if no specific image is set. |
Platform image requirements updated for 2026. Sizes may change; check platform docs for the latest.
Common OG Mistakes
Most broken social previews are caused by simple, avoidable mistakes. These six errors silently hurt your click-through rates on social media.
Posts without images get dramatically fewer clicks and shares. Social platforms may pull a random image from your page or show no image at all, making your link look broken or unprofessional.
Posts with images get up to 2.3x more engagementImages that are too small get cropped or ignored. Images that are too large slow down page load times. Use 1200 x 630 pixels as your universal OG image size to look great across all platforms.
Use 1200 x 630 px as your universal sizeOG image URLs must be absolute (starting with https://). Social platform crawlers cannot resolve relative paths like /images/og.jpg. Always use the full URL including the domain.
Always start image URLs with https://Your meta description targets search engines; your og:description targets social media users. Write a more engaging, action-oriented description for social sharing that encourages clicks.
Write unique copy for social vs. searchFacebook, Twitter, and LinkedIn cache your OG data. After updating your tags, use each platform debugging tool to force a re-scrape. Otherwise, old titles, descriptions, and images will keep showing.
Use platform debug tools after every changeTwitter uses its own meta tags (twitter:card, twitter:title, etc.). While it falls back to OG tags, including Twitter-specific tags gives you more control over how your content appears on the platform.
Include both OG and Twitter Card tagsOptimize Your OG Tags
These strategies help you maximize the impact of your Open Graph tags. All CommonNinja widgets mentioned below are free to start.
Make it effortless for visitors to share your OG-optimized content. Social share buttons placed near your content drive organic sharing and put your carefully crafted OG previews in front of new audiences.
Try Social Share Buttons widget →Your og:title is the headline of your social share card. Use action verbs, numbers, or questions to grab attention. Keep it under 60 characters so it does not get truncated on any platform.
Do not reuse your page hero image. Create a purpose-built OG image with bold text overlay, your brand colors, and a clear visual hierarchy. Tools like Canva and Figma have OG image templates.
Every page on your site should have its own og:title, og:description, and og:image. Reusing the same tags across pages makes all your shared links look identical, reducing click-through rates.
Facebook, Twitter, and LinkedIn all render OG tags slightly differently. Use the Facebook Sharing Debugger, Twitter Card Validator, and LinkedIn Post Inspector to verify your previews look correct everywhere.
Setting og:type to "article" enables additional properties like article:published_time and article:author. This gives platforms more context and can improve how your content is categorized and displayed.
If your page has frequently asked questions, use accordions to keep them organized. Clean, structured content makes it easier to write compelling og:descriptions that summarize what visitors will find.
Try Accordion widget →Content feeds automatically pull in new updates. Fresh, regularly updated pages give you more reasons to share on social media, and every share puts your OG tags to work driving new traffic.
Try Feeds widget →Social Meta Tags Glossary
OG tags are just one piece of the social metadata puzzle. Here is how they compare to other markup standards, and when to use each one.
| Standard | Definition | Syntax | When to Use |
|---|---|---|---|
| OG Tags | Open Graph meta tags that control how your content appears when shared on Facebook, LinkedIn, and other social platforms. Defined by Facebook in 2010 as part of the Open Graph protocol. | meta property="og:*" | Every page you want to look professional when shared on social media |
| Twitter Cards | Twitter-specific meta tags that define how your content appears in tweets. Twitter supports summary, summary_large_image, app, and player card types. | meta name="twitter:*" | Any page that may be shared on Twitter/X |
| Schema.org | A collaborative vocabulary for structured data markup. Used in JSON-LD format to help search engines understand your page content for rich results. | JSON-LD script block | Earning rich snippets, knowledge panels, and enhanced search results |
| Structured Data | Machine-readable code added to web pages that helps search engines understand the content. Can be implemented as JSON-LD, Microdata, or RDFa. | JSON-LD / Microdata / RDFa | Improving search engine understanding of your page content |
| Rich Snippets | Enhanced search results that display additional information like ratings, prices, or FAQ answers. Powered by structured data markup on your pages. | Depends on schema type | Increasing click-through rates from search engine results pages |
From the Blog
Dig deeper into the strategies behind Open Graph optimization, social media marketing, and meta tag best practices that drive traffic.
In this article, we are going to discuss how to use social media to drive traffic to your website. ...
Read article →In this article, we explore using social media to promote tournament brackets, discussing strategies for crafting engagi...
Read article →In this article, we are going to discuss the top Social Media Links widgets for your website. We’ll present a list of wi...
Read article →Optimize your social sharing visuals with the perfect Squarespace image size to boost engagement and make a lasting impr...
Read article →