Email Newsletter Header
marketingtailwindpng

Email Newsletter Header

Personalised email header banner. Swap in the recipient's name server-side — zero design work.

Request body
{
  "type": "tailwind",
  "content": "<div class=\"flex h-full w-full items-center justify-between bg-zinc-900 px-14 py-10\">\n  <div class=\"flex flex-col\">\n    <span class=\"font-mono text-xs text-emerald-400\">PERSONALIZED FOR YOU</span>\n    <span class=\"mt-3 text-5xl font-bold text-white\">Welcome back,</span>\n    <span class=\"text-5xl font-bold text-white\">Jordan.</span>\n    <span class=\"mt-3 text-base text-zinc-400\">You have 3 new renders ready in your dashboard.</span>\n    <div class=\"mt-6 flex items-center rounded-lg border border-emerald-500 px-5 py-2\" style=\"align-self:flex-start;\">\n      <span class=\"text-sm font-semibold text-emerald-400\">Open Dashboard →</span>\n    </div>\n  </div>\n  <div class=\"flex flex-col items-center\">\n    <div class=\"flex h-28 w-28 items-center justify-center rounded-full bg-emerald-600\" style=\"border:3px solid #00e676;\">\n      <span class=\"text-4xl font-bold text-white\">JM</span>\n    </div>\n    <span class=\"mt-3 font-mono text-xs text-zinc-500\">Jordan Mills</span>\n  </div>\n</div>",
  "options": {
    "format": "png",
    "dimensions": {
      "width": 1200,
      "height": 380
    },
    "scale": 2
  }
}

Code example

curl -X POST https://renderfy.io/api/v1/render \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
  "type": "tailwind",
  "content": "<div class=\"flex h-full w-full items-center justify-between bg-zinc-900 px-14 py-10\">\n  <div class=\"flex flex-col\">\n    <span class=\"font-mono text-xs text-emerald-400\">PERSONALIZED FOR YOU</span>\n    <span class=\"mt-3 text-5xl font-bold text-white\">Welcome back,</span>\n    <span class=\"text-5xl font-bold text-white\">Jordan.</span>\n    <span class=\"mt-3 text-base text-zinc-400\">You have 3 new renders ready in your dashboard.</span>\n    <div class=\"mt-6 flex items-center rounded-lg border border-emerald-500 px-5 py-2\" style=\"align-self:flex-start;\">\n      <span class=\"text-sm font-semibold text-emerald-400\">Open Dashboard →</span>\n    </div>\n  </div>\n  <div class=\"flex flex-col items-center\">\n    <div class=\"flex h-28 w-28 items-center justify-center rounded-full bg-emerald-600\" style=\"border:3px solid #00e676;\">\n      <span class=\"text-4xl font-bold text-white\">JM</span>\n    </div>\n    <span class=\"mt-3 font-mono text-xs text-zinc-500\">Jordan Mills</span>\n  </div>\n</div>",
  "options": {
    "format": "png",
    "dimensions": {
      "width": 1200,
      "height": 380
    },
    "scale": 2
  }
}' \
  --output render.png
Fork this template to my account →

One click. Free tier includes 1 saved template.

More marketing templates