OG image and favicon generator for Next.js
Design a 1200x630 Open Graph image and a favicon set, and export PNG, SVG and the Next.js ImageResponse files. Free to use, no account.
Choose the primitives library your project already uses. Both look the same: your theme, not the variant, controls colors, shape, type and motion.
About this generator
Type a title, a subtitle and a logo text, choose a background style, and the generator renders a 1200x630 Open Graph image. A second designer produces a favicon set: 16, 32, 48, 180 and 512 pixel PNGs and an SVG icon.
Text uses a system font stack, with no network fonts, and the generator picks a contrast-safe text colour. Download PNG or SVG, or copy the Next.js snippets: opengraph-image.tsx with ImageResponse, icon.tsx and apple-icon.tsx.
How to use it
- Enter the title, subtitle and logo text.
- Choose a background style and colours.
- Design the favicon in the same colours.
- Download the files, or copy the Next.js snippets.
This generator is also a component of the kit: Generator Og Favicon, installed as source in your project.
Want this inside your project?
Agentic UI Kit installs this generator and the other 1156 components as source files, with one theme for all of them. One-time license, unlimited projects.