Open Graph & Twitter Card Generator
Fill in your page's title, description, and image to generate Open Graph and Twitter Card meta tags. Free online Open Graph generator.
Social Preview Mockup
My Page Title
A short, compelling description for social previews.
Free Open Graph & Twitter Card Meta Tag Generator
Fill in your page's title, description, image, and type to generate Open Graph and Twitter Card meta tags, so your link looks right when shared on Facebook, LinkedIn, X/Twitter, Slack, and other apps.
How to Use It
Fill in the fields on the left. The mockup card and generated tags update instantly — copy the code block and paste it into your page's <head>.
Example
Setting og:title, og:description, and an og:image URL produces a rich preview card instead of a bare link when the page is shared on social platforms.
Common Use Cases
- Making sure a blog post or product page shows a proper image and title when shared.
- Testing how different
og:typeand Twitter card values change the preview. - Scaffolding social meta tags for a new site before launch.
FAQs
What image size works best for og:image?
A 1200×630px image is the widely recommended size — it displays well as a large preview across Facebook, LinkedIn, and X/Twitter without being cropped awkwardly.
Why doesn't my updated preview show on Facebook/X right away?
Social platforms cache preview data per URL. After changing your tags, use that platform's own debugger/sharing tool (like Facebook's Sharing Debugger) to force it to re-scrape the page.
Is my data uploaded anywhere?
No — everything is generated entirely client-side in your browser. Nothing you type is sent to a server.