og-image-builder icon indicating copy to clipboard operation
og-image-builder copied to clipboard

Vue + Tailwind Open Graph Image Builder

Open Graph Image Builder

An experimental Web app project for making social cards with JAMstack + serverless architecture. Built with Vue 3 and Tailwind CSS.

Preview

Read about why and how on my blog.

Some ideas for improvements

  • Separate text position and styling (add better position controls)
  • Add ability to save and distribute (allow linking to) designs
  • Implement image rendering with Puppeteer or similar proper backend tool
  • Add an UI for adding layers
  • Add possibility of using Markdown instead of HTML
  • ~~Add ability to use plain color backgrounds instead of images~~ (done in 0.2.0)

Elsewhere

Contributing

Contributions are welcome! Please follow the code of conduct when interacting with others.