Free Open Graph and Twitter Card meta generator

Fill in page title, description, URL, and share image to produce ready-to-paste meta tags for Open Graph and Twitter Card. A simple preview shows how the card may look — all processing stays in your browser.

Use absolute https URLs for og:url and og:image. Recommended image size is 1200×630 for large cards.

TitleDescriptionPage URLImage URL

Image widthImage height

Site nameLocale (optional)

Open Graph type

Twitter card

My Site

My page title

A short summary for social previews and search snippets.

HTML meta tags

<meta property="og:title" content="My page title" />
<meta property="og:description" content="A short summary for social previews and search snippets." />
<meta property="og:url" content="https://example.com/page" />
<meta property="og:site_name" content="My Site" />
<meta property="og:type" content="website" />
<meta property="og:locale" content="en_US" />
<meta property="og:image" content="https://example.com/og-image.jpg" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="My page title" />
<meta name="twitter:description" content="A short summary for social previews and search snippets." />
<meta name="twitter:image" content="https://example.com/og-image.jpg" />

Loading…

How to use this tool

1
Open OG meta generator
Prepare social share tags for a new page.
2
Enter page and image URLs
Add title, description, canonical URL, and 1200×630 image if possible.
3
Copy HTML into your site
Paste the meta tags into the head section of your HTML or template.

Quick facts

Runs locally?	Yes — tags are built in your browser only.
Is anything uploaded?	No. Your text and URLs stay in this tab.
Next.js metadata?	Copy HTML into the head, or map fields to the metadata API in your framework.
Image preview?	If the image URL allows hotlinking, a rough card preview appears on the right.

Top use cases

Build Open Graph and Twitter Card meta tags with live preview — copy HTML, local only.
Runs locally?: Yes — tags are built in your browser only.
Is anything uploaded?: No. Your text and URLs stay in this tab.
Next.js metadata?: Copy HTML into the head, or map fields to the metadata API in your framework.
Image preview?: If the image URL allows hotlinking, a rough card preview appears on the right.

FAQ

Which tags are included?▾

Common og:* properties plus twitter:card, title, description, and image when provided.

Do I need an image?▾

Recommended for link shares; leave blank only if you accept text-only previews.

What locale format?▾

Use Open Graph locale codes such as en_US or zh_CN.

Will platforms show exactly this preview?▾

Each network caches and crops differently — always test with their debuggers.

Special characters in title?▾

Quotes and ampersands are escaped in the content attribute automatically.

article vs website type?▾

Use article for blog posts; website for home and landing pages.