👁️ OGP image preview

You can enter the content of the OGP meta tag to preview how the link will appear on Twitter, Facebook, LINE, Slack, LinkedIn, and Discord.

Enter OGP information

🖼️ Drag & drop OGP image

or click to select a file

𝕏 Twitter / X Preview

f Facebook Preview

LINE Preview

No image set
Title will appear here
A description will appear here
example.com

Slack Preview

example.com
Title will appear here
A description will appear here
No image set

in LinkedIn Preview

No image set
Title will appear here
example.com

Discord Preview

example.com
Title will appear here
A description will appear here
No image set

Usage and Application Examples

  • Pre-check the image displayed on social networking sites before publishing a blog post
  • Verify that OGP images are properly sized and positioned in the preview
  • Check the share display on Twitter/Facebook/Line/LinkedIn/Discord at once
  • Improve your own site's OGP settings by referring to other sites' OGP settings

What is OGP Image Preview?

This tool displays how Open Graph Protocol metadata appears when shared across social platforms including Twitter, Facebook, LINE, Slack, LinkedIn, and Discord. Rather than guessing how your content looks when shared, instantly preview actual rendering on each platform. OGP tags control the title, description, image, and URL that appear in social previews. Seeing platform-specific rendering helps identify formatting issues before sharing. This saves time correcting unsightly previews that damage engagement and click-through rates.

How to Use

Enter your Open Graph meta tags into the preview tool's input field. Include og:title, og:description, og:image, and og:url tags in standard HTML meta format. The tool immediately renders previews showing exactly how each platform displays your content. Twitter previews show different card styles for images versus video content. Facebook rendering demonstrates how descriptions truncate and images scale on mobile devices. LinkedIn displays professional formatting suitable for corporate content. Discord embeds show custom colors and structured layouts. Slack previews highlight how rich text formatting and images appear in channel messages. Compare previews across all platforms simultaneously to identify inconsistencies requiring correction.

Use Cases

Blog publishers optimize article metadata before publishing to ensure attractive social previews that increase click-through rates. E-commerce platforms verify product images and descriptions appear correctly when customers share items to Instagram or TikTok. Digital marketers test campaign message formatting across channels before launching social media blitzes. Content creators check how video thumbnails and descriptions render on YouTube versus Vimeo before publishing. Corporate communications departments ensure branded imagery and messaging appear consistently across LinkedIn, Twitter, and Facebook. News organizations preview article headlines and images as they appear in aggregators and social feeds. Educators validate course promotional images display properly when students share content to study group channels. Development teams perform QA testing on OGP implementation before deploying website updates to production.

Tips & Insights

Platform-specific image dimensions vary significantly—square images work differently than widescreen formats across channels. Test images at exactly 1200x630 pixels for optimal Twitter and Facebook rendering. LinkedIn favors portrait-oriented images while Instagram prefers square content. Avoid dense text overlays that compress illegibly on mobile device previews. Verify character limits for titles and descriptions since platforms truncate differently. Use emojis strategically to add visual interest without cluttering text content excessively.

Frequently Asked Questions

How to use OGP preview?

Enter a URL or directly enter an OGP tag to preview how it will look when shared on Twitter, Facebook, LINE, Slack, LinkedIn, and Discord.

Is it the same as the actual SNS display?

Although the card layouts of major SNSs are reproduced, slight differences may occur due to changes in the specifications of each platform.

What is the recommended size for OGP images?

1200x630 pixels is recommended. This ratio (approximately 1.91:1) will display optimally on major social networking sites such as Facebook, Twitter, LINE, LinkedIn, Discord, etc.

How do I check if OGP is set up correctly?

You can preview the og:title, og:description, and og:image settings by simply entering the URL into this tool.

What are the features of OGP display on LinkedIn?

On LinkedIn, the og:image appears large at the top, with the og:title in bold and the domain name in gray below it. Since this is a business-oriented social networking site, it is important to have an image and title that give a professional impression.

What are the characteristics of the OGP display on Discord?

In Discord, links are displayed in embedded (embed) format. It features a colored border on the left, the site name, title, and description on the left, and a small thumbnail image on the right.

Can you preview OGP for Discord?

Yes, enter a URL to preview how it appears on Discord, Twitter, Facebook, LINE, and other platforms. Discord-specific embed previews (title, description, image, site name) are also supported.

How does the og:description length affect different social platforms?

Most platforms display 150-160 characters of the og:description before truncating with ellipsis. Facebook typically shows 2-3 lines, while Twitter shows slightly less depending on image size. LinkedIn and Discord may display descriptions differently based on how the preview is rendered—keeping descriptions under 150 characters ensures consistent display across all platforms.

What is the difference between og:type variations (website, article, product)?

The og:type property tells social platforms how to interpret and display your content. 'website' is generic, 'article' includes publication date and author info for news content, while 'product' adds pricing and availability data. Each type may render differently on platforms like Facebook, displaying additional metadata specific to that content category.

How does og:locale work for multilingual content?

The og:locale property specifies the primary language of your content (e.g., 'ja_JP' for Japanese, 'en_US' for English). You can also use og:locale:alternate to list alternative language versions, which helps search engines and social platforms understand your content structure. This is especially important for multilingual sites with language-specific pages.

When should I use og:url with a canonical URL?

og:url should point to the definitive page URL you want shared, while canonical indicates the 'true' version of a page to search engines. For most cases, these should be the same URL. Use og:url when the page might be accessed via multiple URLs (like tracking parameters) and you want the clean version shared on social media.

How long does social media cache OGP metadata after updating?

Most social platforms cache OGP data for 24 hours or longer, though the timing varies by platform. Facebook caches for several weeks, while Twitter rechecks more frequently. If you update OGP tags, you can manually refresh the cache using each platform's debugging tool (Facebook Sharing Debugger, Twitter Card Validator) to force an immediate update.

Does the preview support og:video and media properties?

Yes, this tool supports og:video, og:image, and related media properties that control what appears in social previews. og:video takes precedence over images on platforms that support video, allowing you to embed video content in shares. Media properties include width, height, type, and alt attributes to ensure proper rendering across devices.