Dynamic Open Graph images
Give every page a link preview that stays up to date
Add one stable og:image URL pattern. HCTI reads each page's meta tags, captures part of the page or fills a template, and reuses the image until the screenshot or template inputs change.
- One URL pattern for every page
- Page screenshot or template
- Cached and preview-aware
<head>
<meta property="og:image" content="https://hcti.io/v1/og/…/product-launch">
<meta property="hcti:selector" content="#share-card">
</head>
One stable image URL
Let each page describe its own preview
Point og:image at an HCTI URL built from the page path. HCTI opens that page, reads its supported meta tags, and returns the cached image for those screenshot or template inputs.
Capture part of the page
Use hcti: meta tags to select an element, apply page-only CSS, wait for content, or set other screenshot options.
<meta property="hcti:selector" content="#social-card">Fill a reusable template
Keep the layout in an HCTI template, then publish page-specific values through html:tv: meta tags.
<meta property="html:tv:headline" content="Our product launch">How it works
From page path to finished link preview
The public URL stays simple while HCTI reads the page, creates the image, and reuses it until the inputs change.
-
Add one og:image pattern
Use your HCTI domain ID and append the current page path. No API key or per-page image URL needs to be published.
-
HCTI reads the page head
On refresh, HCTI fetches the requested page and reads its hcti: screenshot options or html:tv: template values.
-
Serve the matching image
HCTI creates the image when the resolved screenshot or template inputs change, then caches and serves it to link-preview crawlers.
Fresh when it matters
Update previews without rendering on every share
HCTI checks page metadata separately from generating the image. Unchanged screenshot or template inputs reuse the existing render; changed inputs create the next image.
Controlled refreshes
Choose how often HCTI may check each page for updated meta tags. Origin cache headers and ETags can avoid unnecessary work.
Content-based reuse
HCTI hashes the resolved screenshot or template inputs so unchanged pages return the image that already exists.
Preview-aware sizing
Use one image everywhere, fit one render into recognized preview sizes, or render with a platform-specific viewport.
Link preview platforms
See how your image can appear when a link is shared
The same Open Graph image URL can serve many crawlers. Explore focused guidance and recommended preview dimensions for common platforms.
Use cases
Make every important URL more useful when it is shared
Articles and editorial content
Turn each headline, author, hero image, and page design into a preview without adding image-generation logic to the publishing workflow.
Product and marketplace pages
Give every product, listing, storefront, or launch page a current preview image built from the content already on that URL.
Documentation and changelogs
Create recognizable previews for guides, release notes, and technical pages while keeping rendering settings close to the source content.
Customer and campaign pages
Use page screenshots or branded templates for landing pages, case studies, events, and other frequently shared URLs.
Ready for better link previews?
Give every page an image worth sharing
Add one stable OG image URL pattern, keep the supported meta tags on each page, and let HCTI handle rendering and reuse.
Related features
More ways to use HTML/CSS to Image
Learn about related options for image and PDF generation, storage, security, and team access.