snaptxt.app

Meta Tag & OG Preview Generator

Build and preview Open Graph, X Card, and standard HTML meta tags for your web pages — instantly in your browser.

Core

0/60

0/160

Open Graph· X Card

Title & description are reused from Core above.

Your data never leaves your browser — all previews happen locally.

Google Search

example.com

Page Title

Page description will appear here.

Generated HTML
<!-- Primary Meta Tags -->
<meta name="robots" content="index, follow" />

<!-- Open Graph / Facebook -->
<meta property="og:type" content="website" />

<!-- X Card -->
<meta name="twitter:card" content="summary_large_image" />

Quick tips

  • • OG image: use 1200 × 630 px for best results.
  • • Title: keep under 60 chars to avoid truncation.
  • • Description: aim for 150–160 chars.
  • • OG/X tags fall back to core values if left blank.

How to use it

  1. 1Fill in the Core section: page title (50–60 chars), meta description (150–160 chars), canonical URL, author, robots directive, and keywords.
  2. 2Expand the Open Graph section to set the og:title, og:description, og:image (1200 × 630 px recommended), og:type, and site name. Leave fields blank to fall back to the Core values.
  3. 3Expand the X Card section to choose a card type (summary_large_image or summary) and optionally override the title, description, image, and @site handle.
  4. 4Switch between the Google, Open Graph, and X Card preview tabs on the right to see how your page will appear across platforms.
  5. 5Click 'Copy all' on the Generated HTML panel and paste the tags into your page's <head>.

Common use cases

  • Prepare meta tags for a new blog post before publishing — preview exactly how the share card will look on LinkedIn and X.
  • Audit existing pages by pasting their current metadata and seeing whether title/description lengths are within recommended limits.
  • Generate og:image-ready markup for a product launch landing page and test image dimensions before going live.
  • Add X Card tags to a portfolio site so shared links display a large hero image instead of a plain URL.
  • Create noindex / nofollow directives for staging or admin pages without touching server config.

Frequently asked questions

What is the difference between og:title and the page title?
The HTML <title> element controls the browser tab and Google search result headline. og:title is only used when the URL is shared on social platforms like Facebook, LinkedIn, or Slack — it can be a slightly different, more social-friendly version. If og:title is omitted, most platforms fall back to the page title.
What image size should I use for the OG image?
1200 × 630 pixels is the widely recommended size. It renders well on Facebook, LinkedIn, and X's summary_large_image card. For X's compact summary card, 800 × 800 (square) works better. Always use a publicly accessible HTTPS URL — base64 data URIs and localhost URLs are ignored by crawlers.
Do these tags affect my Google ranking?
Meta keywords have no ranking effect (Google has ignored them since 2009). The meta description does not directly influence rankings, but a compelling description improves click-through rate, which can indirectly affect visibility. The canonical URL and robots directives do directly affect crawling and indexing — set robots to 'noindex' on pages you don't want in search results.
What is the X card type and which should I pick?
'summary_large_image' shows a large hero image above the title and description — best for articles, launches, and blog posts. 'summary' shows a small square thumbnail beside the text — good for tools, profiles, and short content. 'app' is for mobile app install cards. When in doubt, use summary_large_image and supply a 1200 × 630 image.
Is any of my data sent to a server?
No. All tag generation and previews happen entirely in your browser using JavaScript. Nothing you type is transmitted anywhere — safe for private, unreleased, or proprietary page content.

Related tools

Base64 Encode / Decode
Encode and decode text and files to and from Base64.
HTML Live Preview
Write HTML, CSS, and JavaScript and see the result instantly.
JSON Formatter
Format, validate, minify, diff, and explore JSON — with optional on-device AI that summarizes any payload in plain English.
JWT Decoder
Inspect the header, payload, and expiry of any JSON Web Token — with optional on-device AI that explains what the token grants in plain English.
SQL Formatter
Beautify, format, and minify SQL queries for any dialect — with optional on-device AI that explains what a query does in plain English.
Unix Timestamp Converter
Convert Unix timestamps to dates and back, in any timezone.
Hash Generator
Generate MD5, SHA-1, SHA-256, and SHA-512 hashes in your browser.
JSON to TypeScript
Generate TypeScript interfaces or type aliases from JSON.
Markdown to PDF
Convert Markdown to a beautifully styled PDF in your browser.
QR Code Generator
Make QR codes for websites, Wi-Fi passwords, contact cards, social handles, email, SMS, and more. Download as PNG or SVG — or as a ZIP with one branded QR per social platform.
Password Generator
Generate strong, secure passwords in your browser. Nothing is sent or saved to any server.
Text Diff
Compare two pieces of text and see line-by-line, word-by-word, or character-by-character what changed.
UUID / ULID Generator
Generate UUID v4, UUID v7, or ULID identifiers in bulk, instantly in your browser.
SVG to PNG / JPEG / WebP
Convert SVG to PNG, JPEG, or WebP at any size — quality slider, transparent or colored background, copy to clipboard. Free, in your browser.
URL Encoder / Decoder
Encode or decode URLs and query parameters with component-vs-full-URI scope, plus a query-string breakdown. Free, in your browser.
Regex Tester
Test JavaScript regular expressions with live highlighting and a capture-group inspector — plus an AI regex generator that turns plain-English descriptions into regex (on-device Gemini Nano).
Color Converter
Convert colors between HEX, RGB, HSL, HSV, and OKLCH, and generate tint, shade, and harmony palettes. Free, in your browser.
HTML ↔ Markdown Converter
Convert HTML to Markdown or Markdown to HTML with a live preview. GFM tables, fenced code blocks, inline formatting. Free, in your browser.
Cron Builder
Build cron expressions visually or describe the schedule in plain English and let on-device AI write it for you. Plain-English explanation, next 5 runs, presets.
YAML ↔ JSON Converter
Bidirectional YAML / JSON conversion with multi-document support and indentation control. Free, in your browser.
Convert CSV to JSON
Bidirectional CSV / TSV / JSON conversion. Custom delimiters, header detection, auto-typed numbers. Free, in your browser.
Word & Character Counter
Live word, character, sentence, and paragraph counts with reading and speaking time. Free, in your browser.
Lorem Ipsum Generator
Generate placeholder text — paragraphs, sentences, words, or HTML-wrapped output. Free, in your browser.
JWT Generator
Sign JSON Web Tokens with HS256/384/512, RS256/384/512, or ES256/384. In-browser key generation, no server.
Image Compressor
Compress PNG, JPEG, and WebP images with a live quality slider and side-by-side preview. Free, in your browser.
Favicon Generator
Generate the full favicon set — ICO, PNGs at every size, apple-touch-icon, and PWA manifest — from one image. Free, in your browser.
AI Code Explainer
Paste code, get a plain-English explanation from on-device Gemini Nano — no upload, no API key, no signup.
CSS Gradient Generator
Build linear, radial, and conic CSS gradients visually with color stops, presets, and one-click copy. Free, in your browser.
Box Shadow Generator
Build CSS box-shadows visually with offset, blur, spread, opacity, and inset across stacked layers. Live preview, copy-ready CSS.
Mermaid Live Editor
Render Mermaid diagrams live — flowcharts, sequence, class, state, ER, gantt, pie, and mindmap. Export SVG or PNG.
X.509 Certificate Decoder
Paste a PEM-encoded X.509 certificate — inspect subject, issuer, validity, SANs, key usage, and SHA fingerprints. Free, in your browser.
Australian Medicare Number Generator
Generate and validate Australian Medicare card numbers instantly in your browser. Uses the official check-digit algorithm — perfect for testing and development.
Australian ABN Generator & Validator
Generate and validate Australian Business Numbers (ABN) using the official weighted checksum algorithm. Perfect for testing and development — runs entirely in your browser.
Australian ACN Generator & Validator
Generate and validate Australian Company Numbers (ACN) using the official check-digit algorithm. For testing and development — runs entirely in your browser.
Australian Tax File Number (TFN) Validator
Validate Australian Tax File Numbers (TFN) — checks format and the official check-digit algorithm. No TFN generation to protect against misuse. Runs entirely in your browser.
Australian BSB Number Validator
Validate Australian Bank State Branch (BSB) numbers — checks the 6-digit format and identifies the bank from the first two digits.
New Zealand IRD Number Generator
Generate and validate New Zealand IRD (Inland Revenue Department) numbers for testing and development. Uses the official check-digit algorithm.
New Zealand Business Number (NZBN) Generator
Generate and validate New Zealand Business Numbers (NZBN) — 13-digit GS1 identifiers used by NZ companies. For testing and development.
New Zealand Bank Account Number Validator
Validate New Zealand bank account numbers — checks the BB-BBBB-AAAAAAA-SS format, bank code, and overall structure.
Text Case Converter
Convert text between camelCase, PascalCase, snake_case, kebab-case, SCREAMING_SNAKE, Title Case and more — instantly in your browser.
Number Base Converter
Convert numbers between binary, octal, decimal, and hexadecimal — type in any field and the rest update live.
XML Formatter & Validator
Format, validate, and minify XML documents with custom indentation — uses the browser's native DOMParser, nothing uploaded.
HTML, CSS & JS Minifier
Minify HTML, CSS, and JavaScript online — strip comments, collapse whitespace, and see byte-size savings. Runs entirely in your browser.
Sitemap Validator
Paste or upload a sitemap XML and instantly validate it against Google's rules — structure, URL limits, lastmod format, duplicates, priority, and more. Entirely in your browser.
Bcrypt Hash Generator
Hash passwords with bcrypt and verify hashes — entirely in your browser.
HTML to JSX Converter
Convert HTML to valid JSX — className, htmlFor, inline styles, and void elements handled automatically.
RSA Key Pair Generator
Generate RSA public/private key pairs in PEM format — 2048 or 4096-bit, PKCS#1 or PKCS#8.
Code to Image
Turn code snippets into beautiful shareable images with syntax highlighting and custom backgrounds.
HTTP Status Codes Reference
Look up any HTTP status code — 100 to 599 — with meaning, use case, and common causes.
Image Converter
Convert PNG, JPG, WebP, and AVIF images in your browser — no upload, no signup, batch support.
Image to Text (OCR)
Extract text from images, screenshots, and scanned documents — entirely in your browser. 18 languages supported.