— Lab · 2026 · React · html2canvas · Babel Standalone

Social Image Generator — a travel agency post studio

A browser-based tool that generates ready-to-download social media posts — 1:1 and 9:16 — for a travel agency. Fill in a few fields, pick a layout, drop a photo, download PNG.

— Live demo
All lab
Year
2026
Stack
React
html2canvas
Babel Standalone
Vercel
Live
Open live demo
Source
GitHub

We built this for an amplified travel agency client who needed to produce Instagram and Facebook content quickly, without touching Figma or Canva every time.

The tool runs entirely in the browser — no backend, no build step. React 18 loaded from CDN, Babel Standalone for JSX, html2canvas for PNG export. Deployed on Vercel, behind a simple access-code gate.

What it does

  • 5 layout compositions (full-bleed photo, panel, postcard, editorial, inset card)
  • 3 visual directions with distinct colour systems
  • 3 type treatments (italic editorial serif, modern sans, display uppercase)
  • All content fields optional — empty fields disappear from the output
  • Exports 1080×1080 (feed) and 1080×1920 (stories/reels) as PNG

One interesting fix

box-shadow on a CSS transform: rotate() element renders incorrectly in html2canvas. Swapping to filter: drop-shadow() produces the same visual result and captures correctly.

— Next steps

Tell us what was only ever described.

Start a build

or write to info@amplifiedcreations.com · a senior member of the team answers