You're browsing Email Signature Builder. Sign up to use this tool.

Animated Email Signature

Upload a logo, add your details, pick an animation, then copy the signature into your email client.

Logo

Logo Shape

Crop Aspect

Sets the crop box ratio and resets the display size.

Logo Width — 96px

Logo Height — 96px

Details

Full Name

Job Title

Company / Studio

Tagline (optional)

Phone

Website

Social Media

Handles render as branded logo icons in your signature.

Instagram handle

TikTok handle

YouTube handle

Facebook handle / URL

LinkedIn handle / URL

Style & Effects

Accent Color

Background

Pick a dark background only if your text color contrasts with it.

Font

Logo Animation

Text Animation

Spacing — 16px

Logo Position

Live Preview

as seen in email

<style>
@keyframes svsig_7l0qfgx-fadeIn{from { opacity: 0; } to { opacity: 1; }}
@keyframes svsig_7l0qfgx-shimmer{0% { background-position: 200% 0; } 100% { background-position: -200% 0; }}
.svsig_7l0qfgx-logo{animation:svsig_7l0qfgx-fadeIn 1.2s ease-out 1;animation-fill-mode:both;}
.svsig_7l0qfgx-text{animation:svsig_7l0qfgx-shimmer 3s linear infinite;}
.svsig_7l0qfgx-text{background:linear-gradient(90deg, #38bdf8, #ffffff 50%, #38bdf8);background-size:200%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
</style>
<div style="max-width:480px;background:#ffffff;padding:16px;border-radius:8px;">
<table cellSpacing="0" cellPadding="0" border="0">
         <tr>
    <td style="vertical-align:top;font-family:Helvetica, Arial, sans-serif;">
      <div class="svsig_7l0qfgx-text" style="font-size:18px;font-weight:bold;color:#38bdf8;line-height:1.2;margin-bottom:1px;">Jordan Rivera</div>
      <div style="font-size:13px;color:#111827;line-height:1.3;">Lead Photographer · <span style="color:#38bdf8;font-weight:600;">Rivera Studios</span></div>
      <div style="font-size:12px;color:#6b7280;font-style:italic;line-height:1.3;margin-top:4px;">Cinematic wedding &amp; commercial visuals</div>
      <table cellSpacing="0" cellPadding="0" border="0" style="margin-top:8px;">
        <tr><td style="padding:2px 0;font-size:13px;color:#374151;line-height:1.5;"><strong style="color:#38bdf8;font-size:11px;text-transform:uppercase;letter-spacing:0.08em;">Phone</strong>&nbsp;&nbsp;<a href="tel:(555) 014-2839" style="color:#38bdf8;text-decoration:none;">(555) 014-2839</a></td></tr>
        <tr><td style="padding:2px 0;font-size:13px;color:#374151;line-height:1.5;"><strong style="color:#38bdf8;font-size:11px;text-transform:uppercase;letter-spacing:0.08em;">Email</strong>&nbsp;&nbsp;<a href="mailto:hello@riverastudios.com" style="color:#38bdf8;text-decoration:none;">hello@riverastudios.com</a></td></tr>
        <tr><td style="padding:2px 0;font-size:13px;color:#374151;line-height:1.5;"><strong style="color:#38bdf8;font-size:11px;text-transform:uppercase;letter-spacing:0.08em;">Web</strong>&nbsp;&nbsp;<a href="https://riverastudios.com" style="color:#38bdf8;text-decoration:none;">riverastudios.com</a></td></tr>
      </table>
      <table cellSpacing="0" cellPadding="0" border="0" style="margin-top:8px;"><tr><td style="padding-right:14px;padding-top:2px;vertical-align:middle;">
    <a href="https://instagram.com/riverastudios" style="display:inline-block;text-decoration:none;">
      <table cellSpacing="0" cellPadding="0" border="0"><tr>
        <td width="28" height="28" style="background:#38bdf8;border-radius:14px;width:28px;height:28px;text-align:center;vertical-align:middle;"><svg viewBox="0 0 24 24" width="15" height="15" style="display:block;margin:auto;" fill="#ffffff"><path d="M12 2c2.7 0 3.05.01 4.12.06 1.07.05 1.8.22 2.44.47.66.25 1.22.6 1.77 1.15.55.55.9 1.11 1.15 1.77.25.64.42 1.37.47 2.44.05 1.07.06 1.42.06 4.12s-.01 3.05-.06 4.12c-.05 1.07-.22 1.8-.47 2.44-.25.66-.6 1.22-1.15 1.77-.55.55-1.11.9-1.77 1.15-.64.25-1.37.42-2.44.47-1.07.05-1.42.06-4.12.06s-3.05-.01-4.12-.06c-1.07-.05-1.8-.22-2.44-.47a4.9 4.9 0 01-1.77-1.15 4.9 4.9 0 01-1.15-1.77c-.25-.64-.42-1.37-.47-2.44C2.01 15.05 2 14.7 2 12s.01-3.05.06-4.12c.05-1.07.22-1.8.47-2.44.25-.66.6-1.22 1.15-1.77.55-.55 1.11-.9 1.77-1.15.64-.25 1.37-.42 2.44-.47C8.95 2.01 9.3 2 12 2zm0 5a5 5 0 100 10 5 5 0 000-10zm0 8a3 3 0 110-6 3 3 0 010 6zm5.5-9.5a1.2 1.2 0 100 2.4 1.2 1.2 0 000-2.4z"/></svg></td>
        <td style="padding-left:7px;font-family:Helvetica, Arial, sans-serif;font-size:12px;color:#374151;">@riverastudios</td>
      </tr></table>
    </a>
  </td></tr></table>
    </td></tr>
       </table>
</div>

Animations play in Apple Mail and other clients that support CSS. Most other clients (Gmail, Outlook) show a clean static signature. Paste the HTML into your email client's signature settings.