Developer Tools · Developer
OGP Generator
Generate OGP tags for social sharing. Preview for Facebook, X, LINE, and LinkedIn. Also create SEO meta tags and 1200×630px OGP images.Runs in your browser
Last updated:
How to Use
Expand how to useCollapse how to use
- 1
Enter basic information
Fill in the title, description, page URL, site name, and other OGP-related information.
- 2
Preview on social media
Check real-time previews for Facebook, X, LINE, and LinkedIn.
- 3
Copy the code
Copy the generated OGP tags and paste them into the <head> section of your HTML.
Basic Information
Social Media Preview
X (Twitter)
LINE
Generated Code
<meta property="og:type" content="website" /> <meta property="og:locale" content="ja_JP" /> <meta name="twitter:card" content="summary_large_image" />
Basic Information
Robots Settings
Open Graph Settings
X (Twitter) Card Settings
Search Result Preview
Generated Code
<meta name="robots" content="index, follow"> <!-- Open Graph / Facebook --> <meta property="og:type" content="website"> <meta property="og:locale" content="ja_JP"> <!-- Twitter Card --> <meta name="twitter:card" content="summary_large_image">
Preview updated: Enter a title
Input Settings
If the image URL cannot be loaded, the generator will use a gradient background.
Generated Preview
Output size: 1280 x 630 px
Social Preview Check
X (Twitter)
Enter a title
When you enter a description, preview text will appear here.
Your Site
Enter a title
When you enter a description, preview text will appear here.
Your Site
LINE
Enter a title
When you enter a description, preview text will appear here.
Your Site
Enter a title
When you enter a description, preview text will appear here.
Your Site
About OGP Generator
OGP Generator creates complete Open Graph Protocol tags with real-time visual previews showing exactly how your page will appear when shared on Facebook, X (Twitter), LINE, and LinkedIn. Fill in your page title, description, URL, and image to generate og:title, og:description, og:image, og:url, and og:type tags, plus X (Twitter) Card settings with dedicated card type selection and account name fields. Character count displays with recommendation alerts help you keep titles and descriptions within optimal lengths for each platform. Copy the generated HTML code with one click and paste it into your page's <head> section.
Key Features
- Essential OGP tags (og:title, og:description, og:image, og:url)
- X (Twitter) Card settings (Card type, account name, dedicated image)
- Real-time preview for 4 platforms (Facebook, X, LINE, LinkedIn)
- Character count display and recommendation range alerts
- One-click code copy feature
Common Use Cases
- Preview and fine-tune how blog posts appear when shared on X or LinkedIn
- Generate OGP tags for product launch landing pages
- Verify Open Graph markup before deploying to production
- Set up Twitter Cards for developer documentation sites
- Optimize OGP images and descriptions for marketing campaigns
Frequently Asked Questions
What is OGP (Open Graph Protocol)?
OGP is a protocol developed by Facebook that specifies what information to display when a page is shared on social media. When og:title, og:description, og:image, etc. are set, that information is displayed when shared.
What's the difference between Facebook and X display?
Facebook uses OGP tags directly, while X (Twitter) uses Twitter Card tags. This tool lets you set and preview both separately. When Twitter Card is not set, X falls back to OGP tags.
What image size is best?
Facebook and LINE recommend 1200x630px, X recommends 1200x600px for summary_large_image. Using 1200x630px as a common size works well across all platforms.
Why doesn't the preview match the actual display?
Each platform caches OGP information. Use Facebook's Sharing Debugger or X's Card Validator to clear the cache. Also, verify that your OGP image URL is publicly accessible.
What Content Type (og:type) should I choose?
'website' is for top pages and portal sites, 'article' is for blog posts and news articles. Most pages should use 'website' unless they are clearly articles.