JSFiddle - React, Tailwind, and code Playground
by eurica
HTML
<!DOCTYPE html>
<html style="font-weight: 300">
<head style="font-weight: 300">
<meta charset="utf-8" style="font-weight: 300">
<meta name="viewport" content="width=device-width, initial-scale=1" style="font-weight: 300">
<style type="text/css" style="font-weight: 300">
@import url(https://fonts.googleapis.com/css?family=Lato:400,700);
</style>
</head>
<body class="" style='font-size: 16px; color: #2f2936; padding: 0; font-family: "Lato", "Helvetica Neue", helvetica, sans-serif; background-image: url(https://www.sentry.io/_static/1597163358/sentry/images/email/sentry-pattern.png); -webkit-font-smoothing: antialiased; width: 100%; font-weight: 300; margin: 0; background-color: #fff'>
<div class="preheader" style="padding: 0; font-size: 0; display: none; max-height: 0; font-weight: 300; mso-hide: all; line-height: 0"></div>
<table class="main" style='border-radius: 4px; font-size: 16px; color: #2f2936; border-collapse: separate; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); border-spacing: 0; max-width: 700px; font-family: "Lato", "Helvetica Neue", helvetica, sans-serif; border: 1px solid #c7d0d4; padding: 0; -webkit-font-smoothing: antialiased; width: 100%; font-weight: 300; margin: 15px auto; background-color: #fff'>
<tr style="font-weight: 300">
<td style="padding: 0; font-weight: 300; margin: 0; text-align: center">
<div class="header" style="padding: 23px 0; font-size: 14px; font-weight: 300; border-bottom: 1px solid #dee7eb">
<div class="container" style="padding: 0 20px; max-width: 600px; font-weight: 300; margin: 0 auto; text-align: left">
<h1 style="font-size: 38px; color: #000; letter-spacing: -1px; padding: 0; font-weight: normal; margin: 0; line-height: 42px">
<a href="https://www.sentry.io" style="color: #4674ca; font-weight: 500; text-decoration: none"><img src="https://www.sentry.io/_static/1597163358/sentry/images/email/sentry_logo_full.png" width="125px" height="29px" alt="Sentry"...