Gerador de Open Graph

Generate Open Graph tags with a live social preview card

100% gratuito. Funciona totalmente no seu navegador: seus arquivos e dados nunca saem do seu dispositivo e nada é enviado para nenhum servidor.

0/95
0/300
Recommended: 1200 × 630 px, JPEG or PNG
Social Preview
image
Your page title
Generated Tags

Sobre esta ferramenta

When someone shares your link, the platform fetches the page and builds a preview card from its Open Graph tags. Without them it guesses - grabbing whatever text and image it can find - and the result is usually a truncated sentence next to your logo or, worse, nothing at all. Since that card is what people actually see in a feed, it does more to determine whether anyone clicks than the page title does. Four tags carry the weight: og:title, og:description, og:image and og:url. The image matters most, because it occupies most of the card; 1200×630 is the size to target, and it must be an absolute URL, since scrapers do not resolve relative paths. The behaviour that catches people out is caching. Facebook and LinkedIn cache what they fetched the first time, so fixing your tags does not fix an already-shared link until you clear the cache through their own debugging tools. Tags are generated in your browser.

Fluxo de trabalho

Audite uma página antes de publicá-la

  1. 1Extrair a páginaObtenha seus títulos, links, imagens e metadados.Abrir
  2. 2Verificar as meta tagsTítulo e descrição como os buscadores os leem.Abrir
  3. 3Pré-visualizar o cartão de compartilhamentoVeja como fica ao publicar nas redes sociais.Você está aqui
  4. 4Capturar a telaGuarde uma captura da página finalizada para seus registros.Abrir

Como usar esta ferramenta

  1. Enter your title and descriptionThese can differ from your SEO title and meta description - write them for someone scrolling a feed.
  2. Add an absolute image URL1200×630, and the full URL including https://. Relative paths are not resolved by scrapers.
  3. Set the canonical og:urlThe address the share should point to, without tracking parameters.
  4. Paste the tags into your head and testUse the platform debugger to confirm and to clear any cached version.

Por que usar

  • Live preview, so you see the card before publishing rather than after someone shares it.
  • Generates correct syntax, where a mistyped property name silently does nothing.
  • Covers the four tags that actually determine how the card renders.
  • Runs in your browser with no account.
  • Output is plain HTML for any site or framework.

Usos comuns

  • Setting up sharing previews for a new page or article.
  • Fixing pages that share as a blank or unappealing card.
  • Giving a landing page a share image tailored for social rather than reusing the logo.
  • Standardising previews across a site where each page currently guesses.
  • Preparing a launch where the shared card is the first thing most people will see.

Dicas para melhores resultados

  • Use 1200×630. Smaller images render as a small thumbnail beside text instead of a full-width card, which performs noticeably worse.
  • Always use absolute image URLs. A relative path is the single most common reason an image fails to appear.
  • Test with the platform debugger before launch, and use it to clear the cache when you change tags on an already-shared URL.
  • Write the og:description for a feed, not for search. It is a hook, not a summary.
  • Twitter/X reads Open Graph as a fallback, but its own Card tags give more control - the Twitter Card Generator covers those.

Erros a evitar

  • Using a relative image path, so no image appears in the card at all.
  • Changing tags and assuming the fix is live - the platform serves its cached copy until you clear it.
  • Using an image too small or the wrong shape, which downgrades the card to a thumbnail layout.
  • Omitting og:url, letting tracking-parameter variants be shared and counted as separate URLs.
  • Reusing the SEO meta description verbatim, which reads as a search snippet rather than something worth clicking in a feed.

Perguntas frequentes

Without them, platforms often fall back to guessing a title/image from the page content, which can produce an inconsistent or unappealing preview - explicit Open Graph tags give you full control over how your shared links look.

A common recommendation is 1200x630 pixels, which displays well across most platforms without awkward cropping - the live preview in this tool helps you check how your chosen image actually renders.

Twitter/X falls back to Open Graph when its own tags are absent, so you get a reasonable card either way. For full control - particularly the large-image card format - add dedicated Twitter Card tags with the Twitter Card Generator.

Nearly always a relative image URL. Scrapers do not resolve relative paths, so og:image must be a complete address including https://. After that, check the image is publicly reachable and not blocked by robots.txt.

Because platforms cache what they fetched the first time a URL was shared. Facebook's Sharing Debugger and LinkedIn's Post Inspector both re-scrape on demand, which is the only way to refresh an already-cached link.

Not necessarily. A meta description is written for a search result; an og:description is written for someone scrolling a feed. The second can be shorter, punchier and less literal without hurting SEO at all.

Yes. Open Graph Generator is free for normal use with no account required, and ToolBox does not add a watermark to your result.

Most tools in this category run in your browser so the file stays on your device. If a tool needs a temporary server job, files are handled for that job only and are not kept as a lasting archive.

As pessoas também pesquisam

  • open graph tags generator
  • og image size 1200x630
  • facebook link preview not working
  • social share preview tester
  • og tags for linkedin
  • clear facebook link cache
  • why is my link preview blank

Useful in

Related guides