HTML to Image

<div style="width:100%;height:630px;display:flex;flex-direction:column;justify-content:center;padding:80px;box-sizing:border-box;background:linear-gradient(135deg,#4f46e5 0%,#7c3aed 50%,#db2777 100%);font-family:system-ui,sans-serif;color:#fff">
  <div style="font-size:28px;font-weight:600;opacity:.85;letter-spacing:.05em;text-transform:uppercase">Online Multi Tools</div>
  <div style="font-size:72px;font-weight:800;line-height:1.1;margin-top:24px">Ship your side project this weekend</div>
  <div style="font-size:30px;margin-top:32px;opacity:.9">60+ free developer tools · no signup · runs in your browser</div>
</div>

<div style="width:100%;padding:64px;box-sizing:border-box;background:#fafafa;font-family:Georgia,serif">
  <div style="border-left:6px solid #6366f1;padding-left:32px">
    <div style="font-size:34px;line-height:1.45;color:#18181b">&ldquo;Simplicity is the ultimate sophistication. Every feature you don't add is a feature that can't break.&rdquo;</div>
    <div style="margin-top:24px;font-size:20px;color:#71717a;font-family:system-ui,sans-serif">— A wise engineer</div>
  </div>
</div>

<div style="display:inline-flex;align-items:center;gap:20px;padding:28px 36px;background:#18181b;border-radius:20px;font-family:system-ui,sans-serif">
  <div style="width:56px;height:56px;border-radius:14px;background:linear-gradient(135deg,#22d3ee,#6366f1);display:flex;align-items:center;justify-content:center;font-size:30px">🚀</div>
  <div>
    <div style="font-size:34px;font-weight:800;color:#fff">12,847</div>
    <div style="font-size:15px;color:#a1a1aa;margin-top:2px">Deploys this month</div>
  </div>
</div>