Revolvapp can generate
HTML emails based on a template.
The email code is fully ready to be sent through email services.
Here is an example of generated HTML email from the Revolvapp demo.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>
My Email
</title>
<link href="https://fonts.googleapis.com/css?family=Inter:400,400i,700,700i" rel="stylesheet">
<style type="text/css">
#outlook a{padding:0}.ExternalClass{width:100%}.ExternalClass,.ExternalClass p,.ExternalClass span,.ExternalClass font,.ExternalClass td,.ExternalClass div{line-height:100%}body,table,td,a{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}table,td{mso-table-lspace:0;mso-table-rspace:0}img{-ms-interpolation-mode:bicubic}img{border:0;outline:none;text-decoration:none}a img{border:none}td img{vertical-align:top}table,table td{border-collapse:collapse}body{margin:0;padding:0;width:100% !important}.mobile-spacer{width:0;display:none}@media all and (max-width:639px){.container{width:100% !important;max-width:600px !important}.mobile{width:auto !important;max-width:100% !important;display:block !important}.mobile-center{text-align:center !important}.mobile-right{text-align:right !important}.mobile-left{text-align:left!important;}.mobile-hidden{max-height:0;display:none !important;mso-hide:all;overflow:hidden}.mobile-spacer{width:auto !important;display:table !important}.mobile-image,.mobile-image img {height: auto !important; max-width: 600px !important; width: 100% !important}}
</style>
<!--[if mso]><style type="text/css">body, table, td, a { font-family: Arial, Helvetica, sans-serif !important; }</style><![endif]-->
</head>
<body style="font-family: Inter, Helvetica, Arial, sans-serif; margin: 0px; padding: 0px; background-color: #ffffff;">
<span style="color: transparent; display: none; height: 0px; max-height: 0px; max-width: 0px; opacity: 0; overflow: hidden; visibility: hidden; width: 0px;">This is preheader and it will show as a preview in some mail clients.</span>
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="body" style="width: 100%;">
<tbody>
<tr>
<td align="center" valign="top" style="vertical-align: top; line-height: 1; padding: 40px 5px 80px;">
<table cellpadding="0" cellspacing="0" border="0" width="600" class="main container" style="width: 600px; border-collapse: separate;">
<tr>
<td align="left" valign="top" bgcolor="#fff" style="vertical-align: top; line-height: 1; background-color: #ffffff; border-radius: 6px;">
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="block" style="width: 100%; border-collapse: separate;">
<tr>
<td align="center" valign="top" bgcolor="#f2fff0" style="vertical-align: top; line-height: 1; padding: 52px; background-color: #f2fff0; border-radius: 10px;">
<span style="display: inline-block; font-size: 0px; line-height: 0; vertical-align: top;"><a href="https://imperavi.com" target="_blank" style="font-family: Inter, Helvetica, Arial, sans-serif; font-size: 0px; font-weight: normal; color: #0091ff; text-decoration: none; cursor: pointer; line-height: 100%; display: block;"><img border="0" width="135" src="https://imperavi.com/_email2/revolvapp-logo.png" style="margin: 0px; padding: 0px; max-width: 100%; border: none; vertical-align: top; width: 135px;"></a></span>
<p style="padding: 0px; margin: 48px 0px 0px; font-family: Inter, Helvetica, Arial, sans-serif; color: #919990; font-size: 12px; line-height: 18px; font-weight: bold;">
NEWSLETTER
</p>
<h1 class="h1" style="padding: 0px; margin: 10px 0px 0px; font-style: normal; font-family: Inter, Helvetica, Arial, sans-serif; font-size: 32px; line-height: 39px; color: #111118; font-weight: bold;">
Beautifully written<br class="mobile-hidden">
headline goes here
</h1>
<span style="display: inline-block; font-size: 0px; line-height: 0; vertical-align: top;"><img border="0" width="447" src="https://imperavi.com/_email2/photo-1.jpg" style="margin: 0px; padding: 0px; max-width: 100%; border: none; vertical-align: top; width: 447px;"></span>
<p style="padding: 0px; margin: 0px 0px 36px; font-family: Inter, Helvetica, Arial, sans-serif; color: #222228; font-size: 16px; line-height: 24px;">
The carbon in our apple pies Apollonius of Perga rich in mystery shores of the cosmic ocean inconspicuous motes of rock and gas Vangelis. Descended from astronomers permanence of the stars across the centuries preserve and cherish that pale blue dot ship of the imagination muse about.
</p>
<table cellpadding="0" cellspacing="0" border="0" width="auto" style="width: auto; font-size: 14px; font-weight: normal; background-color: #3c887e; color: #ffffff; border-radius: 3px; border-collapse: separate;">
<tr>
<td align="center" valign="top" bgcolor="#3C887E" style="vertical-align: top; line-height: 1; text-align: center; font-family: Inter, Helvetica, Arial, sans-serif; border-radius: 3px;">
<a target="_blank" href="https://example.com" style="display: inline-block; box-sizing: border-box; cursor: pointer; text-decoration: none; margin: 0px; font-family: Inter, Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; background-color: #3c887e; color: #ffffff; border-radius: 3px; border: 1px solid #3c887e; padding: 14px 40px;">CTA text</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="block" style="width: 100%;">
<tr>
<td align="left" valign="top" style="vertical-align: top; line-height: 1; padding: 50px 0px;">
<h2 class="h2" align="center" style="padding: 0px; margin: 0px 0px 20px; font-style: normal; font-family: Inter, Helvetica, Arial, sans-serif; font-size: 28px; line-height: 37px; color: #111118; font-weight: bold;">
Highlights
</h2>
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="grid" style="width: 100%;">
<tr>
<td align="left" valign="top" class="mobile column" style="vertical-align: top; line-height: 1; width: 260px; padding: 0px 0px 20px;">
<span style="display: inline-block; font-size: 0px; line-height: 0; vertical-align: top;"><a href="https://imperavi.com" target="_blank" style="font-family: Inter, Helvetica, Arial, sans-serif; font-size: 0px; font-weight: normal; color: #0091ff; text-decoration: none; cursor: pointer; line-height: 100%; display: block;"><img border="0" width="220" src="https://imperavi.com/_email2/photo-2.jpg" style="margin: 0px; padding: 0px; max-width: 100%; border: none; vertical-align: top; width: 220px;"></a></span>
<h3 class="h3" style="padding: 0px; margin: 10px 0px; font-style: normal; font-family: Inter, Helvetica, Arial, sans-serif; font-size: 20px; line-height: 28px; color: #111118; font-weight: bold;">
The ash of stellar alchemy stirred by starlight
</h3>
<p style="padding: 0px; margin: 0px; font-family: Inter, Helvetica, Arial, sans-serif; color: #58585d; font-size: 14px; line-height: 21px;">
With pretty stories for which there's little good evidence network of wormholes vanquish the impossible a mote of dust suspended in a sunbeam Drake Equation.
</p>
</td>
<td class="mobile-hidden column-spacer" style="width: 40px; min-width: 40px;">
</td>
<td align="left" valign="top" class="mobile column" style="vertical-align: top; line-height: 1; width: 260px; padding: 0px 0px 20px;">
<span style="display: inline-block; font-size: 0px; line-height: 0; vertical-align: top;"><a href="https://imperavi.com" target="_blank" style="font-family: Inter, Helvetica, Arial, sans-serif; font-size: 0px; font-weight: normal; color: #0091ff; text-decoration: none; cursor: pointer; line-height: 100%; display: block;"><img border="0" width="220" src="https://imperavi.com/_email2/photo-3.jpg" style="margin: 0px; padding: 0px; max-width: 100%; border: none; vertical-align: top; width: 220px;"></a></span>
<h3 class="h3" style="padding: 0px; margin: 10px 0px; font-style: normal; font-family: Inter, Helvetica, Arial, sans-serif; font-size: 20px; line-height: 28px; color: #111118; font-weight: bold;">
Birth something incredible is waiting to be known
</h3>
<p style="padding: 0px; margin: 0px; font-family: Inter, Helvetica, Arial, sans-serif; color: #58585d; font-size: 14px; line-height: 21px;">
Encyclopaedia galactica two ghostly white figures in coveralls and helmets are soflty dancing colonies circumnavigated as a patch of light decipherment
</p>
</td>
</tr>
</table>
<p align="center" style="margin: 40px 0px 20px; font-family: Inter, Helvetica, Arial, sans-serif;">
<a target="_blank" href="https://example.com/link/" style="font-family: Inter, Helvetica, Arial, sans-serif; text-decoration: underline; color: #3c887e; font-size: 20px; font-weight: bold; line-height: 1.5;">Read more on our website</a>
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table cellpadding="0" cellspacing="0" border="0" width="600" class="footer container" style="width: 600px; border-collapse: separate;">
<tr>
<td align="left" valign="top" bgcolor="#3A3238" style="vertical-align: top; line-height: 1; padding: 50px 60px 60px; background-color: #3a3238; border-radius: 6px;">
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="block" style="width: 100%;">
<tr>
<td align="center" valign="top" style="vertical-align: top; line-height: 1;">
<p style="padding: 0px; margin: 0px; font-family: Inter, Helvetica, Arial, sans-serif; color: #d7d6d7; font-size: 12px; line-height: 18px;">
Copyright © 2020 Revolvapp<br>
All rights reserved<br>
<br>
Revolvapp Inc, Espoo, Finland 02650
</p>
<div class="social" style="margin: 40px 0px;"><a href="https://facebook.com/"><img border="0" width="24px" alt="Facebook" src="https://imperavi.com/_email2/facebook-logo.png" style="margin: 0px; padding: 0px; max-width: 100%; border: none; vertical-align: top; width: 24px;"></a><span class="#222228" style="display: inline-block; line-height: 0; font-family: Inter, Helvetica, Arial, sans-serif; font-size: 16px;"> </span><a href="https://twitter.com/"><img border="0" width="24px" alt="Twitter" src="https://imperavi.com/_email2/twitter-logo.png" style="margin: 0px; padding: 0px; max-width: 100%; border: none; vertical-align: top; width: 24px;"></a><span class="#222228" style="display: inline-block; line-height: 0; font-family: Inter, Helvetica, Arial, sans-serif; font-size: 16px;"> </span><a href="https://instagram.com/"><img border="0" width="24px" alt="Instagram" src="https://imperavi.com/_email2/instagram-logo.png" style="margin: 0px; padding: 0px; max-width: 100%; border: none; vertical-align: top; width: 24px;"></a></div>
<p style="padding: 0px; margin: 0px; font-family: Inter, Helvetica, Arial, sans-serif; color: #d7d6d7; font-size: 12px; line-height: 18px;">
You subscribed to this newsletter because you agreed to receive our monthly news shot when you registered your email on <a href="https://example.com" style="color: #ffffff; font-size: 12px;">https://revolvapp.com</a>.To unsubscribe, click <a href="https://example.com" style="color: #ffffff; font-size: 12px;">Unsubscribe</a>.
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>