Links

Connected items


How they look

Since emails don’t have hover states accessible, we render our links accordingly; that is, with an underline.

View demo Open in new window
320 x 568
View code
    
<tr>
  <td style="padding-top: 16px; padding-right: 16px; padding-bottom: 16px; padding-left: 16px; background-color: #FFFFFF; color: #000000; overflow: hidden;" bgcolor="#FFFFFF">
    <p class="gg-e-text" style="margin: 0; font-family: 'Poppins', 'Century Gothic', 'CenturyGothic', 'AppleGothic', sans-serif; font-size: 16px; font-weight: 400; line-height: 24px;"><a href="#" style="font-family: 'Poppins', 'Century Gothic', 'CenturyGothic', 'AppleGothic', sans-serif; font-weight: bold; color: #00528A; text-decoration: underline;">I am a link on a white background</a></p>
  </td>
</tr>
<tr>
  <td style="padding-top: 16px; padding-right: 16px; padding-bottom: 16px; padding-left: 16px; background-color: #000000; color: #ffffff; overflow: hidden;" bgcolor="#000000">
    <p class="gg-e-text" style="margin: 0; font-family: 'Poppins', 'Century Gothic', 'CenturyGothic', 'AppleGothic', sans-serif; font-size: 16px; font-weight: 400; line-height: 24px;"><a class="gg-e-text" href="#" style="font-size: 16px; line-height: 20px; font-family: 'Poppins', 'Century Gothic', 'CenturyGothic', 'AppleGothic', sans-serif; font-weight: bold; color: #35ADCE; text-decoration: underline;">I am a link on a black background</a></p>
  </td>
</tr>