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

- **Source:** https://amplifiedcreations.com/lab/social-image-generator
- **Publisher:** amplified creations (https://amplifiedcreations.com/)
- **Published:** 2026-05-16
- **Updated:** 2026-05-17
- **Language:** en
- **Stack:** React, html2canvas, Babel Standalone, Vercel
- **Live demo:** https://ptthe13.github.io/amplifiedlabs/social-image-generator/
- **Source code:** https://github.com/PTthe13/amplifiedlabs/tree/main/social-image-generator

---

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.

---

Published by amplified creations, an independent technology studio in Leiria & Lisboa, Portugal. Contact: info@amplifiedcreations.com · More: https://amplifiedcreations.com/llms.txt
