A Pen by Julio Berina on CodePen.
Created
August 25, 2018 02:30
-
-
Save julioberina/5aa0ab69f08329038914ad925c8c25a1 to your computer and use it in GitHub Desktop.
Black Rifle Coffee Company HTML Email
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- Container for entire page --> | |
| <table cellpadding="0" cellspacing="0" border="0" width="100%" style="background-color: #D0D0D0;"> | |
| <tr> | |
| <td> | |
| <!-- Container for HTML Email --> | |
| <table cellpadding="0" cellspacing="0" border="0" width="600" align="center" style="background-color: white;"> | |
| <!-- Start of Nav --> | |
| <tr style="width: 100%; background-color: black;"> | |
| <td> | |
| <!-- Navbar Logo --> | |
| <table cellpadding="0" cellspacing="0" border="0" style="width: 40%;" align="left"> | |
| <tr> | |
| <td><img src="https://drive.google.com/uc?id=11eBKMoWrmvOZfiSPy18BNo_5lruxQvRT" alt="Black Rifle Coffee Company" | |
| style="padding-left: 55px; padding-top: 20px;"> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- Navbar Links --> | |
| <table cellpadding="0" cellspacing="0" border="0" style="width: 60%; font-family: Arial, sans-serif; padding: 35px; letter-spacing: 1px;" align="center"> | |
| <tr> | |
| <td align="center"> | |
| <a style="color: white; text-decoration: none; text-transform: uppercase; font-weight: 600; font-size: 12px;" href="#">Coffee</a> | |
| </td> | |
| <td align="center"> | |
| <a style="color: white; text-decoration: none; text-transform: uppercase; font-weight: 600; font-size: 12px;" href="#">Apparel</a> | |
| </td> | |
| <td align="center"> | |
| <a style="color: white; text-decoration: none; text-transform: uppercase; font-weight: 600; font-size: 12px;" href="#">Gear</a> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| <!-- End of Nav --> | |
| <!-- Start of pour-over image --> | |
| <tr style="width: 100%;"> | |
| <td> | |
| <table cellpadding="0" cellspacing="0" border="0" width="100%"> | |
| <tr> | |
| <td><img src="https://drive.google.com/uc?id=1_xe28Iq6imtCRJv6vlLF6NNS9SXeD6ZL" alt="pour-over coffee"></td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| <!-- End of pour-over image --> | |
| <!-- Start of Checkout --> | |
| <tr> | |
| <td> | |
| <table cellpadding="0" cellspacing="0" border="0"> | |
| <tr> | |
| <td align="center"> | |
| <h1 style="text-transform: uppercase; font-family: Impact, Verdana, sans-serif; font-size: 46px;">Get lost on the way to checkout?</h1> | |
| <p style="font-size: 16px; font-family: sans-serif; color: #A3A3A3; line-height: 1.2; | |
| position: relative; bottom: 10px;"> | |
| No need to search here. <br>The goods are in your cart, right where you left them. | |
| </p><br> | |
| <a href="#" style="text-transform: uppercase; font-family: Helvetica, sans-serif; color: white; | |
| background-color: orange; text-decoration: none; padding-left: 36px; | |
| padding-right: 36px; padding-top: 15px; padding-bottom: 15px; | |
| font-weight: 600; font-size: 10pt; border-radius: 2px;">Checkout Now</a> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| <!-- End of Checkout --> | |
| <!-- Start of Gunship coffee image --> | |
| <tr> | |
| <td> | |
| <table cellpadding="0" cellspacing="0" border="0" align="center" style="padding-top: 60px;"> | |
| <tr> | |
| <td style="padding-left: 55px;"> | |
| <img src="https://drive.google.com/uc?id=1RCuMepNUKnTElawkYwkgGx_OkIkgyRB-" alt="gunship coffee"> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td><p style="font-family: sans-serif; font-size: 16pt; text-transform: uppercase; | |
| font-weight: 600; padding-left: 15px; position: relative; bottom: 22px;">Gunship Coffee Roast</p><br></td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| <!-- End of Gunship coffee image --> | |
| <!-- Start of social media --> | |
| <tr> | |
| <td> | |
| <table cellpadding="0" cellspacing="0" border="0" style="background-color: orange; width: 100%; padding: 27px;"> | |
| <tr> | |
| <td align="center"> | |
| <span style="text-transform: uppercase; color: white; font-family: Helvetica, sans-serif; | |
| text-decoration: none; font-weight: 600; font-size: 12pt;">Get Connected</span> | |
| </td> | |
| <td align="center"> | |
| <img src="https://drive.google.com/uc?id=1IuDrWQaNxnplQhF_4sje454yRgYyD1iy" alt="facebook"> | |
| </td> | |
| <td align="center"> | |
| <img src="https://drive.google.com/uc?id=1t2FNYtMgfZDUDDuEo7myajnywjIoJjdY" alt="twitter"> | |
| </td> | |
| <td align="center"> | |
| <img src="https://drive.google.com/uc?id=1Wa5cNexCdC3GCHh319fBQs1gV6SnfYk-" alt="youtube"> | |
| </td> | |
| <td align="center"> | |
| <img src="https://drive.google.com/uc?id=1LeW6k8oIq9xFq6k4jn998V89hvp19DR9" alt="instagram"> | |
| </td> | |
| <td align="center"> | |
| <img src="https://drive.google.com/uc?id=1YDHI9gfyqlMReZzoQsS4Jra85MssnmQ6" alt="pinterest"> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| <!-- End of social media --> | |
| <!-- Start of footer --> | |
| <tr> | |
| <td> | |
| <table cellpadding="0" cellspacing="0" border="0" align="center" style="background-color: black; width: 100%; padding-top: 27px; color: white; | |
| font-family: Helvetica, sans-serif; font-size: 10px; padding-bottom: 27px;"> | |
| <tr> | |
| <td align="center"> | |
| <img src="https://drive.google.com/uc?id=1q8Xg-KiRO-FP_LRBqp3_vygxwIK7OnH5" alt="Black Rifle Coffee Company Logo"> | |
| <p style="position: relative; bottom: 6px;">This email was sent by:</p> | |
| <p>Black Rifle Coffee Company | |
| <br> | |
| <a href="#" style="color: white;">1144 S 500 W<br> Salt Lake City, UT 84101<br>US</a><br> | |
| <a href="#" style="color: white;">Unsubscribe</a> | |
| </p> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| <!-- End of footer --> | |
| </table> | |
| </td> | |
| </tr> | |
| </table> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment