OG Image Generator
Generate a 1200×630 share image from a title, subtitle, and colors.
Category: Image Tools
When to use?
Use it to quickly make the preview image shown when sharing a blog post, service page, or notice link.
How to use
- Enter a title and subtitle.
- Choose background and accent colors.
- Generate a 1200×630 PNG image.
Input Explanation
Enter the title, subtitle, background color, and accent color for the OG image.
Calculation Basis
It renders the background, accent area, title, and subtitle on a 1200×630 Canvas (the recommended Open Graph ratio) and saves as PNG.
Usage Examples
- Make link share images - Make an OG image for social and messenger previews.
- Prepare images for upload - Preview the result, then tidy images for blogs, shops, or social media.
- Compare results - Check original and result side by side for quality and display.
Examples
- Make a share image from a new blog title and summary
- Make a messenger-share preview image from a notice title
Cautions
- It processes via browser canvas, so original metadata (EXIF) may be lost or transparent areas may change color.
- Extremely high-resolution large files may fail to convert due to browser image-decoding limits.
FAQ
Is the size fixed?
Yes, it generates at the common recommended OG size of 1200×630.
What if the title is long?
Long titles auto-wrap or resize to fit within the 1200×630 area.
Can I change the background color or style?
Set title/subtitle text and background color to make a cover image that fits your post.
Where is the image used?
Put it in your page's og:image meta tag so it shows as the preview when shared on social/messengers.
Related Tools
- Thumbnail Generator - Make a simple 1280×720 thumbnail image from text and a background color.
- Solid Color Image Generator - Generate a solid-color PNG image from a color and size.
- Gradient Image Generator - Generate a gradient PNG image from two colors and a direction.
- SVG Background Pattern Generator - Generate repeating background patterns (dots, stripes, grid) as SVG code for web backgrounds.
- Image Resizer - Resize multiple images in the browser with aspect ratio kept, no server upload.
- Image Cropper - Enter pixel coordinates to crop just the area you need, in the browser.