Contextual images

Pictures that read the room

Drop one <img> tag into your page. It reads the words around it, searches for a matching photo, and renders one — sized, credited, and cached. Every image below was chosen automatically from the text of its section. No one picked them.

Backpacking the Dolomites

If you only have four days in the Dolomites, spend them on the Alta Via 1. The trail strings together mountain huts across the range, so you carry a light pack and wake up somewhere new each morning. Most hikers set out before dawn to reach the high passes while the limestone still glows pink — and to be back under a roof before the afternoon storms roll in over the peaks.

The <img> that produced this photo — hover to see what it reads

<img src="https://opengraphimage.com/cdn/cx0d9c1a7e/contextual?image_id=travel"
data-og-context=".demo-travel">
Contextual image auto-selected for the travel section
Contextual image auto-selected for the food section

The Neapolitan pizza obsession

There is a reason a real Neapolitan pizza is protected by law. The rules are strict: a wood-fired oven at around 900 degrees, dough left to proof for at least a day, San Marzano tomatoes, and no more than ninety seconds in the flames. What comes out is soft and blistered at the edges, meant to be folded and eaten by hand before it has a chance to cool.

The <img> that produced this photo — hover to see what it reads

<img src="https://opengraphimage.com/cdn/cx0d9c1a7e/contextual?image_id=food"
data-og-context=".demo-food">

Shipping code at 2am in Tokyo

Tokyo is a good city in which to be a night-owl engineer. The convenience stores never close, the trains run late, and there is always a 24-hour café where you can nurse a coffee and push one more commit. Somewhere past midnight the office towers of Shinjuku empty out, the neon keeps burning, and the city feels like it belongs to whoever is still awake.

The <img> that produced this photo — hover to see what it reads

<img src="https://opengraphimage.com/cdn/cx0d9c1a7e/contextual?image_id=urban"
data-og-context=".demo-urban">
Contextual image auto-selected for the urban section

How it works

The image points at an origin configured for your site. When it renders, the origin fetches your page, finds this exact <img>, reads the region you name in data-og-context, turns it into an image search, and renders a matching photo — with attribution, cached until your copy changes.

<img src="https://cdn.opengraphimage.com/YOUR-KEY/blog/my-post?image_id=hero"
     data-og-context=".article-body">

OG image templates for link previews. A rendering platform for dynamic images at any size — email, publishing, and beyond.

Made with ♥️ by Paper Crow