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
One page head producing portrait, square, and landscape Open Graph image previews.
<head> example.com/articles/product-launch
One page-owned setup Read from the page
<head>
  <meta property="og:image" content="https://hcti.io/v1/og/…/product-launch">
  <meta property="hcti:selector" content="#share-card">
</head>
One page, three preview shapes
Pinterest pins preview
Pinterest 1000 × 1500
Instagram posts preview
Instagram 1080 × 1080
Apple Messages messages preview
Apple Messages 1200 × 628

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

The public URL stays simple while HCTI reads the page, creates the image, and reuses it until the inputs change.

  1. 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.

  2. HCTI reads the page head

    On refresh, HCTI fetches the requested page and reads its hcti: screenshot options or html:tv: template values.

  3. 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.

Use cases

Make every important URL more useful when it is shared

Preview a URL

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.