OG Images for HTML
OG images for any website — just paste a meta tag
No framework? No problem. OGMagic works with plain HTML. Just add a single meta tag to your page's head section.
Quick Start
Add OGMagic to your HTML project — no packages to install, no API keys to configure.
<!DOCTYPE html>
<html>
<head>
<!-- OGMagic: Dynamic OG image -->
<meta property="og:image" content="https://ogmagic.dev/api/og?template=gradient-mesh&title=My+Website&description=Welcome+to+my+site&domain=mysite.com" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://ogmagic.dev/api/og?template=gradient-mesh&title=My+Website&description=Welcome+to+my+site&domain=mysite.com" />
</head>
</html>Dynamic OG Images
Generate unique OG images per page using route data:
<!-- Hugo: layouts/_default/single.html -->
<meta property="og:image"
content="https://ogmagic.dev/api/og?template=gradient-mesh&title={{ .Title | urlquery }}&description={{ .Description | urlquery }}&domain=mysite.com" />
<!-- Jekyll: _includes/head.html -->
<meta property="og:image"
content="https://ogmagic.dev/api/og?template=gradient-mesh&title={{ page.title | url_encode }}&description={{ page.description | url_encode }}&domain=mysite.com" />
<!-- WordPress: header.php -->
<meta property="og:image"
content="https://ogmagic.dev/api/og?template=gradient-mesh&title=<?php echo urlencode(get_the_title()); ?>&domain=<?php echo urlencode(get_bloginfo('url')); ?>" />💡 Works with any static site generator (Hugo, Jekyll, 11ty), CMS (WordPress, Ghost), or plain HTML. If you can write a meta tag, you can use OGMagic.
Why use OGMagic with HTML?
No build step
Images are generated on-demand via URL. No build plugins, no CI/CD changes.
55+ templates
Professional designs out of the box. Customize with query parameters.
No API key needed
Free tier works instantly — just use the URL. No signup, no config.
Every platform
Optimized 1200×630 images that look great on Twitter/X, Facebook, LinkedIn, Discord, and Slack.
Ready to add OG images to your HTML app?
Start with 50 free API calls/month. No signup needed.