← knowledge.oriz.in

Ray.so

service code-screenshotsocialog-imageprimary

Ray.so

Role

Generates the og:image PNG for code-heavy blog posts on oriz-blog-site. When a post is mostly about a code snippet, the social card readers see when the URL is shared on X / LinkedIn / WhatsApp is a Ray.so screenshot of that snippet (with the post title overlaid by our build step).

We use ray.so's hosted instance at ray.so — no self-hosting, just the URL-driven screenshot endpoint piped through a build-time fetch in oriz-blog-site's image pipeline.

Free tier

Card / subscription required?

NO. The hosted ray.so endpoint requires no account at all. The URL parameters encode the snippet + theme; the response is a PNG.

Build-time integration

// oriz-blog-site/scripts/build-og-images.ts
const png = await fetch(
  `https://ray.so/api/image?code=${encodeURIComponent(snippet)}` +
  `&theme=midnight&language=typescript&padding=64&background=true`
).then(r => r.arrayBuffer());
// → write to /public/og/<slug>.png, referenced in <meta property="og:image">

The PNGs are committed to the repo (or generated on Cloudflare Pages build) and served from the site's own origin — ray.so isn't a hot- path dependency at request time.

Alternatives

Swap cost

Low — the screenshot URL is the only coupling. If ray.so's hosted endpoint ever disappears, fall back to: (a) self-hosting raycast/ray-so on Cloudflare Pages, or (b) replacing the build step with Shiki + Satori running inside a GitHub Action.

Why this is our pick

Free, no account, OSS escape hatch, and produces the best-looking default of any code-screenshot tool tested. The URL-driven API fits a build-step model — no human in the loop per post.

Cross-refs