Confirm Sign Up – Branded

Branded announcement-style email confirmation with Supabase green accents.

Preview
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html dir="ltr" lang="en"><head><meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/><meta name="x-apple-disable-message-reformatting"/><style></style><style>
    @font-face {
      font-family: 'Inter';
      font-style: normal;
      font-weight: 400;
      mso-font-alt: 'Arial';
      src: url(https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuLyfAZ9hiJ-Ek-_EeA.woff2) format('woff2');
    }

    * {
      font-family: 'Inter', Arial;
    }
  </style><style>
    @font-face {
      font-family: 'Inter';
      font-style: normal;
      font-weight: 600;
      mso-font-alt: 'Arial';
      src: url(https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuGKYAZ9hiJ-Ek-_EeA.woff2) format('woff2');
    }

    * {
      font-family: 'Inter', Arial;
    }
  </style><style>
    @font-face {
      font-family: 'Inter';
      font-style: normal;
      font-weight: 700;
      mso-font-alt: 'Arial';
      src: url(https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuFuYAZ9hiJ-Ek-_EeA.woff2) format('woff2');
    }

    * {
      font-family: 'Inter', Arial;
    }
  </style></head><body style="background-color:rgb(244,246,248);margin:0"><!--$--><!--html--><div style="display:none;overflow:hidden;line-height:1px;opacity:0;max-height:0;max-width:0" data-skip-in-text="true">Confirm your email address to activate your account — link expires in 24 hours.<div> ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏</div></div><!--head--><!--body--><table border="0" width="100%" cellPadding="0" cellSpacing="0" role="presentation" align="center"><tbody><tr><td style="background-color:rgb(244,246,248);margin:0rem;padding:0rem;font-family:ui-sans-serif,system-ui,sans-serif,&quot;Apple Color Emoji&quot;,&quot;Segoe UI Emoji&quot;,&quot;Segoe UI Symbol&quot;,&quot;Noto Color Emoji&quot;"><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="background-color:rgb(244,246,248);padding-bottom:2.5rem;padding-top:2.5rem;padding-right:1rem;padding-left:1rem"><tbody><tr><td><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="max-width:600px;margin-right:auto;margin-left:auto"><tbody><tr style="width:100%"><td><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="background-color:rgb(255,255,255);border-top-left-radius:1rem;border-top-right-radius:1rem;overflow:hidden"><tbody><tr><td><div style="height:0.25rem;width:100%;background-color:rgb(62,207,142)"></div><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="padding-right:2.5rem;padding-left:2.5rem;padding-top:2rem;padding-bottom:1.5rem"><tbody><tr><td><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation"><tbody style="width:100%"><tr style="width:100%"><td data-id="__react-email-column"><table cellPadding="0" cellSpacing="0" border="0"><tr><td><div style="display:inline-flex;align-items:center;gap:10px"><div style="width:36px;height:36px;background-color:#3ECF8E;border-radius:8px;display:inline-block"></div><p style="font-size:20px;line-height:1;margin:0rem;padding:0rem;color:rgb(17,24,39);font-weight:700;margin-top:0rem;margin-bottom:0rem;margin-left:0rem;margin-right:0rem">AppName</p></div></td></tr></table></td></tr></tbody></table></td></tr></tbody></table><hr style="width:100%;border:none;border-top:1px solid #eaeaea;border-color:rgb(229,231,235);margin-right:2.5rem;margin-left:2.5rem;margin-bottom:0rem;margin-top:0rem"/><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="padding-right:2.5rem;padding-left:2.5rem;padding-top:2.5rem;padding-bottom:1rem"><tbody><tr><td><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation"><tbody style="width:100%"><tr style="width:100%"><td data-id="__react-email-column"><div style="display:inline-block;background-color:#ECFDF5;border:1px solid #A7F3D0;border-radius:20px;padding:4px 14px;margin-bottom:20px"><p style="font-size:12px;line-height:24px;margin:0rem;padding:0rem;font-weight:600;color:#059669;letter-spacing:0.05em;margin-top:0rem;margin-bottom:0rem;margin-left:0rem;margin-right:0rem">ACTION REQUIRED</p></div></td></tr></tbody></table><h1 style="color:rgb(17,24,39);font-weight:700;margin:0rem;margin-bottom:1rem;font-size:26px;line-height:1.3">One more step — confirm your email</h1><p style="font-size:16px;line-height:1.7;color:rgb(75,85,99);margin:0rem;margin-bottom:1.5rem;margin-top:0rem;margin-left:0rem;margin-right:0rem">Thanks for signing up! Click below to verify your email address and get started. This helps us keep your account secure and ensures you receive important notifications.</p><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="margin-bottom:1.5rem"><tbody><tr><td><a href="https://appname.com/confirm?token=placeholder" style="line-height:100%;text-decoration:none;display:inline-block;max-width:100%;mso-padding-alt:0px;border-radius:8px;font-weight:600;color:#ffffff;text-align:center;background-color:#3ECF8E;font-size:16px;padding:14px 32px;padding-top:14px;padding-right:32px;padding-bottom:14px;padding-left:32px" target="_blank"><span><!--[if mso]><i style="mso-font-width:400%;mso-text-raise:21" hidden>&#8202;&#8202;&#8202;&#8202;</i><![endif]--></span><span style="max-width:100%;display:inline-block;line-height:120%;mso-padding-alt:0px;mso-text-raise:10.5px">Confirm Email Address</span><span><!--[if mso]><i style="mso-font-width:400%" hidden>&#8202;&#8202;&#8202;&#8202;&#8203;</i><![endif]--></span></a></td></tr></tbody></table><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="border-radius:0.5rem;margin-bottom:2rem;background-color:#FFFBEB;border:1px solid #FDE68A;padding:14px 18px"><tbody><tr><td><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation"><tbody style="width:100%"><tr style="width:100%"><td data-id="__react-email-column"><p style="font-size:13px;line-height:1.6;margin:0rem;padding:0rem;color:#92400E;margin-top:0rem;margin-bottom:0rem;margin-left:0rem;margin-right:0rem"><span style="font-weight:600">This link expires in 24 hours.</span> <!-- -->If you did not create an account, you can safely ignore this email. No action is required on your part.</p></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table><hr style="width:100%;border:none;border-top:1px solid #eaeaea;border-color:rgb(229,231,235);margin-right:2.5rem;margin-left:2.5rem;margin-bottom:0rem;margin-top:0rem"/><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="padding-right:2.5rem;padding-left:2.5rem;padding-bottom:2rem;padding-top:2rem"><tbody><tr><td><h2 style="color:rgb(17,24,39);font-weight:600;margin:0rem;margin-bottom:1.5rem;font-size:16px;line-height:1.4">What happens after you confirm?</h2><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="margin-bottom:1rem"><tbody style="width:100%"><tr style="width:100%"><td data-id="__react-email-column" style="width:40px;vertical-align:top;padding-right:0.75rem"><div style="width:28px;height:28px;background-color:#ECFDF5;border:1px solid #A7F3D0;border-radius:50%;text-align:center;line-height:28px;font-weight:700;font-size:13px;color:#059669;display:inline-block">1</div></td><td data-id="__react-email-column"><p style="font-size:14px;line-height:1.2;margin:0rem;font-weight:600;color:rgb(17,24,39);margin-bottom:2px;margin-top:0rem;margin-left:0rem;margin-right:0rem">Your account is activated</p><p style="font-size:13px;line-height:1.6;margin:0rem;color:rgb(107,114,128);margin-top:0rem;margin-bottom:0rem;margin-left:0rem;margin-right:0rem">Full access to all features is unlocked immediately.</p></td></tr></tbody></table><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="margin-bottom:1rem"><tbody style="width:100%"><tr style="width:100%"><td data-id="__react-email-column" style="width:40px;vertical-align:top;padding-right:0.75rem"><div style="width:28px;height:28px;background-color:#ECFDF5;border:1px solid #A7F3D0;border-radius:50%;text-align:center;line-height:28px;font-weight:700;font-size:13px;color:#059669;display:inline-block">2</div></td><td data-id="__react-email-column"><p style="font-size:14px;line-height:1.2;margin:0rem;font-weight:600;color:rgb(17,24,39);margin-bottom:2px;margin-top:0rem;margin-left:0rem;margin-right:0rem">Set up your profile</p><p style="font-size:13px;line-height:1.6;margin:0rem;color:rgb(107,114,128);margin-top:0rem;margin-bottom:0rem;margin-left:0rem;margin-right:0rem">Personalize your workspace and preferences.</p></td></tr></tbody></table><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation"><tbody style="width:100%"><tr style="width:100%"><td data-id="__react-email-column" style="width:40px;vertical-align:top;padding-right:0.75rem"><div style="width:28px;height:28px;background-color:#ECFDF5;border:1px solid #A7F3D0;border-radius:50%;text-align:center;line-height:28px;font-weight:700;font-size:13px;color:#059669;display:inline-block">3</div></td><td data-id="__react-email-column"><p style="font-size:14px;line-height:1.2;margin:0rem;font-weight:600;color:rgb(17,24,39);margin-bottom:2px;margin-top:0rem;margin-left:0rem;margin-right:0rem">Start building</p><p style="font-size:13px;line-height:1.6;margin:0rem;color:rgb(107,114,128);margin-top:0rem;margin-bottom:0rem;margin-left:0rem;margin-right:0rem">Explore your dashboard and get started right away.</p></td></tr></tbody></table></td></tr></tbody></table><hr style="width:100%;border:none;border-top:1px solid #eaeaea;border-color:rgb(229,231,235);margin-right:2.5rem;margin-left:2.5rem;margin-bottom:0rem;margin-top:0rem"/><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="padding-right:2.5rem;padding-left:2.5rem;padding-bottom:1.5rem;padding-top:1.5rem"><tbody><tr><td><p style="font-size:13px;line-height:1.6;color:rgb(107,114,128);margin:0rem;margin-top:0rem;margin-bottom:0rem;margin-left:0rem;margin-right:0rem">If the button above does not work, copy and paste the link below into your browser:</p><a href="https://appname.com/confirm?token=placeholder" style="color:#3ECF8E;text-decoration-line:none;font-size:13px;word-break:break-all;text-decoration:underline" target="_blank">https://appname.com/confirm?token=placeholder</a></td></tr></tbody></table></td></tr></tbody></table><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="background-color:rgb(249,250,251);border-bottom-right-radius:1rem;border-bottom-left-radius:1rem;border-style:solid;border-width:1px;border-top-style:solid;border-top-width:0px;border-color:rgb(229,231,235);padding-right:2.5rem;padding-left:2.5rem;padding-bottom:2rem;padding-top:2rem"><tbody><tr><td><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="margin-bottom:1.5rem"><tbody style="width:100%"><tr style="width:100%"><td align="center" data-id="__react-email-column"><table cellPadding="0" cellSpacing="0" border="0" align="center"><tr><td style="padding-right:16px"><a href="https://twitter.com/appname" style="color:#6B7280;text-decoration-line:none;font-size:13px;text-decoration:none" target="_blank">Twitter</a></td><td style="padding-right:16px"><a href="https://github.com/appname" style="color:#6B7280;text-decoration-line:none;font-size:13px;text-decoration:none" target="_blank">GitHub</a></td><td style="padding-right:16px"><a href="https://linkedin.com/company/appname" style="color:#6B7280;text-decoration-line:none;font-size:13px;text-decoration:none" target="_blank">LinkedIn</a></td><td><a href="https://appname.com/docs" style="color:#6B7280;text-decoration-line:none;font-size:13px;text-decoration:none" target="_blank">Docs</a></td></tr></table></td></tr></tbody></table><hr style="width:100%;border:none;border-top:1px solid #eaeaea;border-color:rgb(229,231,235);margin-bottom:1.5rem;margin-top:0rem"/><p style="font-size:12px;line-height:1.6;color:rgb(156,163,175);text-align:center;margin:0rem;margin-bottom:0.5rem;margin-top:0rem;margin-left:0rem;margin-right:0rem">AppName Inc. — 123 Market Street, Suite 400, San Francisco, CA 94105</p><p style="font-size:12px;line-height:1.6;color:rgb(156,163,175);text-align:center;margin:0rem;margin-bottom:0.5rem;margin-top:0rem;margin-left:0rem;margin-right:0rem">You are receiving this email because you created an account at AppName.</p><p style="font-size:12px;line-height:1.6;color:rgb(156,163,175);text-align:center;margin:0rem;margin-top:0rem;margin-bottom:0rem;margin-left:0rem;margin-right:0rem"><a href="https://appname.com/privacy" style="color:#9CA3AF;text-decoration-line:none;text-decoration:underline" target="_blank">Privacy Policy</a> · <a href="https://appname.com/terms" style="color:#9CA3AF;text-decoration-line:none;text-decoration:underline" target="_blank">Terms of Service</a> · <a href="https://appname.com/unsubscribe" style="color:#9CA3AF;text-decoration-line:none;text-decoration:underline" target="_blank">Unsubscribe</a></p><p style="font-size:11px;line-height:24px;color:rgb(209,213,219);text-align:center;margin:0rem;margin-top:1.5rem;margin-bottom:0rem;margin-left:0rem;margin-right:0rem">© 2026 AppName Inc. All rights reserved.</p></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table><!--/$--></body></html>