Open Graph Generator

Build escaped Open Graph tags for a website with a local card preview and copyable HTML.

Make your link ready to share

Website metadata you can copy into your page’s <head>. No URLs or images are fetched.

Page title

Page URL

Public image URL

Use complete HTTP/HTTPS URLs. The image should be publicly accessible; this tool does not check its file, dimensions or availability.

Short description · optional

Image description · recommended

Site name and known image dimensions

Site name · optional

Image width · pixels

Image height · pixels

Only add dimensions you know are correct. Leave both empty otherwise.

Your fields and generated text stay in this tab. No upload, destination request or saved history. Optional usage measurement counts fixed outcomes and result actions, excluding field values, URLs, headers, bodies and contact details.

This tool processes its input contents in your browser instead of sending them to a processing service. Page, asset and fixed usage-measurement requests are described on the Privacy page.

Generate escaped Open Graph website metadata from a title, page URL and public image reference, with optional image descriptions and known dimensions.

How to use it

1Add the page title, absolute page URL and public image URL.
2Optionally add a short description, image description, site name and known dimensions.
3Generate, review and copy the tags into your existing page’s head or download the snippet.

Example

Input: Title: Paper & ink
Output: <meta property="og:title" content="Paper & ink">

The complete export also includes website type, page URL and image URL.

What happens to your data

All fields stay in this tab. URLs and images are never fetched. Fixed optional usage measurements exclude field values and generated content.

Last updated November 2026

Give a shared page a clear title, description and image reference with Open Graph metadata. Enter the page title, its complete URL and the public image URL, then generate tags you can copy into the page’s existing head section. The Open Graph Generator creates HTML text locally; it does not publish a page, visit a URL or upload an image. It is useful when preparing a website launch, a resource page or a shareable guide without manually escaping each HTML attribute.

How it works

The Open Graph protocol defines four basic properties: og:title, og:type, og:image and og:url. This builder includes all four and explicitly uses website as the object type. Optional description, site name, image description and known image dimensions add their own properties. It does not guess article, product or video metadata, create a canonical link element, or generate unrelated search structured data.

An image description becomes og:image:alt, which the protocol recommends with og:image. Width and height are only emitted when both have been supplied as whole pixels from 1 to 20,000. These values are declarations, not measurements: the image is never fetched, decoded or checked. Use dimensions from the actual image. An image that is private, blocked, deleted or unsuitable for a platform will not become usable just because its URL appears in metadata.

HTML attribute characters are escaped, including ampersands, quotes and angle brackets. The generated snippet is displayed as selectable text rather than inserted into this tool’s HTML. HTTP/HTTPS URLs are validated and normalized with the browser’s URL parser, which may lowercase a hostname, remove a default port or encode Unicode. URLs containing credentials, whitespace, backslashes or broken percent escapes are rejected. No remote preview is loaded.

Paste the result into the existing head section and remove conflicting Open Graph tags deliberately. Declaring the og namespace on the surrounding HTML element may be appropriate for your publishing environment; this snippet does not rewrite that element. Social platforms have their own image requirements, crawlers, caches and layouts, so this generator cannot verify the eventual card or promise identical previews. Publishing tags does not guarantee rankings, traffic or citations.

Titles are limited to 200 characters, descriptions to 1,000, image descriptions to 500, site names to 200 and each input URL to 8,192. Unsupported controls and malformed Unicode are rejected. Output is bounded to 64 KiB. Editing any field removes the old result, and Clear cancels an unfinished generation. Inputs and output remain in this tab, without saved history. Fixed optional usage measurements exclude the page and image URLs, title and all other field values.

Worked example: A title with an ampersand

Input: Title: Paper & ink; page: https://example.com/guide; image: https://example.com/share.jpg
Result: <meta property="og:title" content="Paper & ink"> <meta property="og:type" content="website"> <meta property="og:url" content="https://example.com/guide"> <meta property="og:image" content="https://example.com/share.jpg">

An independent HTML parser recovers the original title. The snippet does not fetch or validate the image.

Common use cases

Prepare a website share-card snippet without hand-escaping a title containing quotes or ampersands.
Declare a public share image and its accessible description before publishing a guide.
Add known image dimensions without quietly downloading a private image URL.
Review explicit website metadata before giving it to a site editor or developer.

Frequently asked questions

Which Open Graph meta tags are required?＋

The protocol’s four basic properties are og:title, og:type, og:image and og:url. The generator includes them and fixes og:type to website. Optional descriptions, site name, image alt text and dimensions can be added.

Does this show the exact Facebook, LinkedIn or chat preview?＋

No. It generates metadata text without contacting your site or image. Each sharing platform controls its own crawler, cache and layout. Check the published page using the platform you care about.

Will it find my image size automatically?＋

No image is fetched. Supply both actual pixel dimensions if you know them, or leave both empty. An image URL alone is enough for the four basic tags, but the protocol recommends an image description.

Where do I put the generated HTML?＋

Place the meta tags in your page’s existing head section, replacing conflicting Open Graph metadata. Your site framework may provide a metadata API instead of direct HTML editing. The tool does not change or publish your website.

Does adding social meta tags improve Google rankings?＋

No ranking effect is promised. These declarations describe a page to software reading Open Graph metadata. Search visibility and social display depend on many separate systems.

Are my page and image URLs visited?＋

No. Validation and generation happen locally. Nothing fetches or displays the image, and optional fixed usage measurements exclude your URLs and field values.