123

Pen Settings

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource

You're using npm packages, so we've auto-selected Babel for you here, which we require to process imports and make it all work. If you need to use a different JavaScript preprocessor, remove the packages in the npm tab.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Use npm Packages

We can make npm packages available for you to use in your JavaScript. We use webpack to prepare them and make them available to import. We'll also process your JavaScript with Babel.

⚠️ This feature can only be used by logged in users.

Code Indentation

     

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

HTML Settings

Here you can Sed posuere consectetur est at lobortis. Donec ullamcorper nulla non metus auctor fringilla. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

            
              <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta name=”x-apple-disable-message-reformatting”>
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet">
  <style type="text/css">
    .ReadMsgBody {
      width: 100%;
    }

    .ExternalClass {
      width: 100%;
    }

    .ExternalClass,
    .ExternalClass p,
    .ExternalClass span,
    .ExternalClass font,
    .ExternalClass td,
    .ExternalClass div {
      line-height: 100%;
    }

    .ExternalClass * {
      line-height: 100%
    }

    p {
      margin: 1em 0;
    }

    table td {
      border-collapse: collapse;
    }

    .appleLinksWhite a {
      color: #ffffff;
      text-decoration: none;
    }

    .appleLinksWhiteUL a {
      color: #ffffff;
      text-decoration: underline;
    }

    .appleLinksGray a {
      color: #1f326f;
      text-decoration: none;
    }

    .appleFooter a {
      color: #565759;
      text-decoration: none;
    }

    .appleFooterLink2 a {
      color: #313647;
      text-decoration: none;
    }

    a.mobileshow,
    .mobilehide {
      display: none;
      color: #fff;
    }

    .fixAOL a {
      color: #25408f;
      text-decoration: none;
    }

    .image {
      width: 100% !important;
      max-width: 100% !important;
      height: auto !important;
    }

    [office365] button,
    div {
      display: block !important;
    }

    [owa] button,
    div {
      display: block !important;
    }

    @media only screen and (max-width: 800px) {
      html,
      body {
        width: 100%;
        overflow-x: hidden;
      }
      body[yahoo] .mobile-only {
        display: none !important;
      }
      body[yahoo] .mobile-hidden {
        display: block !important;
      }
      body[yahoo] .container {
        width: 100% !important;
      }
      body[yahoo] .image {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
      }
      body[yahoo] .drop {
        width: 100% !important;
        display: block !important;
      }
      body[yahoo] .drop-center {
        width: 100% !important;
        display: block !important;
        text-align: center !important;
      }
      body[yahoo] .IntroPara {
        width: 80% !important;
        max-width: 80% !important;
        height: auto !important;
      }
    }

    @media only screen and (max-width: 450px) {
      body[yahoo] {
        width: 100% !important;
        min-width: 100% !important;
        margin: 0 auto !important;
      }
      body[yahoo] .mobile-only {
        display: block !important;
        max-height: none !important;
      }
      body[yahoo] .mobile-hidden {
        display: none !important;
      }
      body[yahoo] .image {
        width: 100% !important;
        height: auto !important;
      }
      body[yahoo] .mobImage {
        width: 100% !important;
        height: auto !important;
      }
      body[yahoo] .noPad {
        padding-left: 0px !important;
        padding-right: 0px !important;
      }
      body[yahoo] .mobBot20 {
        padding-bottom: 20px !important;
      }
      body[yahoo] .pad0 {
        padding-left: 0px !important;
        padding-right: 0px !important;
        padding-top: 0px !important;
      }
      body[yahoo] .padTop20 {
        padding-top: 20px !important;
      }

      body[yahoo] .pad20 {
        padding-left: 20px !important;
        padding-right: 20px !important;
      }
      body[yahoo] .headlineMobile {
        font-family: 'Source Sans Pro', Arial, sans-serif !important;
        font-size: 24px !important;
        font-weight: 900 !important;
      }
      body[yahoo] .subheadMobile {
        font-family: 'Source Sans Pro', Arial, sans-serif !important;
        font-size: 18px !important;
        font-weight: 900 !important;
      }
      body[yahoo] .bodyMobile {
        font-family: 'Source Sans Pro', Arial, sans-serif !important;
        font-size: 18px !important;
      }
      body[yahoo] .bodyMobileLeft {
        font-family: 'Source Sans Pro', Arial, sans-serif !important;
        font-size: 18px !important;
        text-align: left !important;
        width: 100% !important;
      }
      body[yahoo] .bodymobiletablefull {
        width: 100% !important;
      }
      body[yahoo] .mobileImagePad {
        padding-top: 30px !important;
        padding-left: 0px !important;
        padding-right: 0px !important;
      }
    }

    @media only screen and (max-width: 320px) {
      body[yahoo] .iPhone5 {
        text-align: center !important;
        padding-left: 20px !important;
        padding-right: 0px !important;
      }
    }
  </style>
  <!--[if gte mso 9]>  <style>   /* Target Outlook 2007 and 2010 */   html, body { font-family: Calibri, Arial, sans-serif !important; }     table { font-family: Calibri, Arial, sans-serif !important; }     td { font-family: Calibri, Arial, sans-serif !important; }  </style>  <![endif]-->
  <title></title>
</head>

<body style="margin: 0px; padding:0px; -webkit-text-size-adjust:none; -ms-text-size-adjust: none;" yahoo="fix">
  <style type="text/css">
    div.preheader {
      display: none !important;
    }
  </style>
  <div class="preheader" style="font-size: 1px; display: none !important;">Discover how to get more out of Slack</div>
  <!-- Insert &zwnj;&nbsp; hack after hidden preview text -->
  <div style="display: none; max-height: 0px; overflow: hidden;">
    &nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;
    &nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;
    &nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;
    &nbsp;&zwnj;&nbsp;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;
  </div>
  <table border="0" cellpadding="0" cellspacing="0" width="100%" align="center" class="container" style="table-layout: fixed; margin: 0 auto;" bgcolor="#FFFFFF">
    <tr>
      <td align="center">
        <div align="center">
          <table border="0" cellpadding="0" cellspacing="0" width="100%" align="center" class="container" style="table-layout: fixed; margin: 0 auto;" bgcolor="#FFFFFF">
            <tr>
              <td align="center">
                <table cellpadding="0" cellspacing="0" width="100%" style="min-width: 100%;" class="stylingblock-content-wrapper">
                  <tr>
                    <td class="stylingblock-content-wrapper camarker-inner"></td>
                  </tr>
                </table>
              </td>
            </tr>

            <tr>
              <td align="center"></td>
            </tr>

            <tr>
              <td align="center">
                <table border="0" cellpadding="0" cellspacing="0" width="100%" align="center" class="container" style="table-layout: fixed; margin: 0 auto;" bgcolor="#FFFFFF">
                  <tr>
                    <td align="center">
                      <div align="center">
                        <table width="640" class="container" border="0" align="center" cellpadding="0" cellspacing="0" style="font-family:'Source Sans Pro', Calibri, Arial, sans-serif;" bgcolor="#FFFFFF">
                          <tr>
                            <td align="center">
                              <div align="center">
                                <table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
                                  <tr>
                                    <td align="center">
                                      <table width="600" border="0" cellpadding="0" cellspacing="0" class="container">
                                        <tr>
                                          <td align="center">
                                            <table cellpadding="0" cellspacing="0" width="100%" style="min-width: 100%;" class="stylingblock-content-wrapper">
                                              <tr>
                                                <td class="stylingblock-content-wrapper camarker-inner">
                                                  <!-- Header -->
                                                  <table class="container" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;width:600px;" width="600" cellspacing="0" cellpadding="0" border="0">
                                                    <tr>
                                                      <td class="pad20">
                                                        <table width="100%" cellspacing="0" cellpadding="0" border="0" bgcolor="#ffffff" class="container">
                                                          <tr>
                                                            <td style="padding-top: 30px;" align="left" bgcolor="#ffffff"><a href="https://slack.com/" target="_blank"><img src="https://image.email.slack.com/lib/fe5515707c610d7b7312/m/1/53fd294c-f4d3-46b9-a2b5-5b9400c6bd87.png" alt="Slack Logo" border="0" style="display:block;" width="40"></a></td>
                                                          </tr>
                                                        </table>
                                                      </td>
                                                    </tr>
                                                  </table>
                                                  <!-- /Header -->
                                                </td>
                                              </tr>
                                            </table>
                                          </td>
                                        </tr>

                                        <tr>
                                          <td align="center">
                                            <table cellpadding="0" cellspacing="0" width="100%" style="min-width: 100%;" class="stylingblock-content-wrapper">
                                              <tr>
                                                <td class="stylingblock-content-wrapper camarker-inner">
                                                  <table width="100%" cellpadding="0" cellspacing="0" border="0" class="container" bgcolor="#FFFFFF">
                                                    <tr>
                                                      <td align="center" class="pad20" style="padding-top:20px; padding-bottom: 5px;">
                                                        <table cellpadding="0" cellspacing="0" border="0" width="100%">

                                                          <tr>
                                                            <td style="padding-top: 20px;" align="left" bgcolor="#ffffff"><a href="https://slack.com/slack-tips?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                target="_blank"><img src="https://image.email.slack.com/lib/fe5515707c610d7b7312/m/1/b8dda4b3-2d8d-4550-987e-516977a4122f.png" alt="HeroImage" border="0" style="display:block;" width="100%"></a></td>
                                                          </tr>

                                                          <tr>
                                                            <td height="20" style="border-collapse:collapse;"></td>
                                                          </tr>

                                                          <tr>
                                                            <td align="center" style="padding-top: 20px; font-size: 24px; font-family: 'Source Sans Pro', Calibri, sans-serif; color:#1a1938;"><strong>Get more out of Slack</strong></td>
                                                          </tr>

                                                          <tr>
                                                            <td height="30" style="border-collapse:collapse;"></td>
                                                          </tr>

                                                          <tr>
                                                            <td align="center" width="82%" style="font-size: 18px; font-family: 'Source Sans Pro', Calibri, sans-serif; color:#1a1938;" class="bodyMobileLeft">
                                                              <table width="82%" class="bodymobiletablefull">
                                                                <tr>
                                                                  <td width="82%" align="center" class="bodyMobileLeft">
                                                                    Introducing <a href="https://slack.com/slack-tips?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                      targe="_blank" style="text-decoration:none;color:#1babeb !important;">Slack Tips</a>: a new collection of bite-sized tips, tricks, and how-to's for working in Slack.
                                                                  </td>
                                                                </tr>
                                                              </table>
                                                            </td>
                                                          </tr>

                                                          <tr>
                                                            <td height="20" style="border-collapse:collapse;"></td>
                                                          </tr>

                                                          <tr>
                                                            <td align="center" width="82%" style="font-size: 18px; font-family: 'Source Sans Pro', Calibri, sans-serif; color:#1a1938;" class="bodyMobileLeft">
                                                              <table width="82%" class="bodymobiletablefull">
                                                                <tr>
                                                                  <td width="82%" align="center" class="bodyMobileLeft">
                                                                    Whether you just started using Slack or you’re a seasoned pro, you'll find step-by-step instructions to help your team work better together &mdash; no matter what work you do.
                                                                  </td>
                                                                </tr>
                                                              </table>
                                                            </td>
                                                          </tr>

                                                          <tr>
                                                            <td height="30" style="border-collapse:collapse;"></td>
                                                          </tr>

                                                          <tr>
                                                            <td align="center">
                                                              <!-- CTA Right -->
                                                              <div style="width:100%;max-width:340px;display:inline-block;vertical-align:top;align:left;">
                                                                <table style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;" width="100%" align="left" class="container">
                                                                  <tr>
                                                                    <td style="border-collapse:collapse;text-align:center;" align="left">
                                                                      <div>
                                                                        <!--[if mso]>       <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="https://slack.com/slack-tips?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"  arcsize="7%" strokecolor="#611F69" fillcolor="#611F69" style="height:50px;v-text-anchor:middle;width:340px;margin-bottom:30px !important;" >       <w:anchorlock/>       <center style="color:#ffffff;font-family:Arial,sans-serif;font-size:20px;font-weight:900;" >      Explore Slack Tips       </center>       
</v:roundrect>       <![endif]-->
                                                                        <a href="https://slack.com/slack-tips?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                          class="CTA-Primary" style="font-family:Helvetica, 'Helvetica Neue', Arial, 'Lato', sans-serif;background-color:#611F69;background-image:none;background-repeat:repeat;background-position:top left;background-attachment:scroll;border-width:1px;border-style:solid;border-color:#611F69;border-radius:4px;color:#ffffff;display:inline-block;font-size:20px;font-weight:900;line-height:50px;text-align:center;text-decoration:none;width:340px;min-width:234px;-webkit-text-size-adjust:none;mso-hide:all;">Explore Slack Tips</a>
                                                                      </div>
                                                                    </td>
                                                                  </tr>
                                                                </table>
                                                              </div>
                                                              <!-- /CTA Right -->
                                                              <!--[if (gte mso 9)|(IE)]>       </td>       </tr>       </table>       <![endif]-->
                                                            </td>
                                                          </tr>

                                                          <tr>
                                                            <td height="46" style="border-collapse:collapse;"></td>
                                                          </tr>

                                                        </table>
                                                      </td>
                                                    </tr>
                                                  </table>
                                                  <table width="100%" cellpadding="0" cellspacing="0" border="0" class="container" bgcolor="#F5F4F5">
                                                    <tr>
                                                      <td height="47" style="border-collapse:collapse;"></td>
                                                    </tr>
                                                    <tr>
                                                      <td align="center" style="font-size: 18px; font-family: 'Source Sans Pro', Calibri, sans-serif; color:#1a1938;" class="bodyMobile"><strong>Some tips to get you started:</strong></td>
                                                    </tr>
                                                    <tr>
                                                      <td height="27" style="border-collapse:collapse;"></td>
                                                    </tr>
                                                    <tr>
                                                      <td align="center">
                                                        <HR width="100%" align="center" style="color:rgba(255, 0, 0, 0.3)">
                                                      </td>
                                                    </tr>
                                                    <tr>
                                                      <td height="10" style="border-collapse:collapse;"></td>
                                                    </tr>
                                                    <tr>
                                                      <td align="center">
                                                        <table cellpadding="0" cellspacing="0" border="0" width="100%">
                                                          <tr>
                                                            <td width="20" align="left"></td>
                                                            <td width="32" align="left"><a href="https://slack.com/slack-tips/collect-agenda-items-for-a-meeting?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                target="_blank"><img src="https://image.email.slack.com/lib/fe5515707c610d7b7312/m/1/7c17b7e2-bc89-471e-8845-d14823db5841.png" alt="Collect" border="0" style="display:block;" width="32"></a></td>
                                                            <td width="20" align="left"></td>
                                                            <td width="480" align="left" style="font-size: 18px; font-family: 'Source Sans Pro', Calibri, sans-serif; color:#1a1938;"><a href="https://slack.com/slack-tips/collect-agenda-items-for-a-meeting?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                targe="_blank" style="text-decoration:none;color:#1a1938 !important;">Collect agenda items for a meeting</a></td>
                                                            <td width="20" align="left"></td>
                                                            <td width="10" align="left"><a href="https://slack.com/slack-tips/collect-agenda-items-for-a-meeting?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                targe="_blank" style="text-decoration:none;color:#1a1938 !important;"><img src="https://image.email.slack.com/lib/fe5515707c610d7b7312/m/1/4a151d5c-1e43-4d69-b9cc-52dc4ce57dc9.png" alt="cta1b" border="0" style="display:block;" width="10"></a></td>
                                                            <td width="18" align="left"></td>
                                                          </tr>
                                                        </table>
                                                      </td>
                                                    </tr>
                                                    <tr>
                                                      <td height="10" style="border-collapse:collapse;"></td>
                                                    </tr>
                                                    <tr>
                                                      <td align="center">
                                                        <HR width="100%" align="center" style="color:rgba(255, 0, 0, 0.3)">
                                                      </td>
                                                    </tr>

                                                    <tr>
                                                      <td height="10" style="border-collapse:collapse;"></td>
                                                    </tr>
                                                    <tr>
                                                      <td align="center">
                                                        <table cellpadding="0" cellspacing="0" border="0" width="100%">
                                                          <tr>
                                                            <td width="20" align="left"></td>
                                                            <td width="32" align="left"><a href="https://slack.com/slack-tips/create-and-assign-tasks?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                target="_blank"><img src="https://image.email.slack.com/lib/fe5515707c610d7b7312/m/1/3c23169a-e136-409e-906c-08691bfc21d3.png" alt="Assign" border="0" style="display:block;" width="32"></a></td>
                                                            <td width="20" align="left"></td>
                                                            <td width="480" align="left" style="font-size: 18px; font-family: 'Source Sans Pro', Calibri, sans-serif; color:#1a1938;"><a href="https://slack.com/slack-tips/create-and-assign-tasks?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                targe="_blank" style="text-decoration:none;color:#1a1938 !important;">Create and assign tasks</a></td>
                                                            <td width="20" align="left"></td>
                                                            <td width="10" align="left"><a href="https://slack.com/slack-tips/create-and-assign-tasks?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                targe="_blank" style="text-decoration:none;color:#1a1938 !important;"><img src="https://image.email.slack.com/lib/fe5515707c610d7b7312/m/1/4a151d5c-1e43-4d69-b9cc-52dc4ce57dc9.png" alt="cta2b" border="0" style="display:block;" width="10"></a></td>
                                                            <td width="18" align="left"></td>
                                                          </tr>
                                                        </table>
                                                      </td>
                                                    </tr>
                                                    <tr>
                                                      <td height="10" style="border-collapse:collapse;"></td>
                                                    </tr>
                                                    <tr>
                                                      <td align="center">
                                                        <HR width="100%" align="center" style="color:rgba(255, 0, 0, 0.3)">
                                                      </td>
                                                    </tr>
                                                    <tr>
                                                      <td height="10" style="border-collapse:collapse;"></td>
                                                    </tr>
                                                    <tr>
                                                      <td align="center">
                                                        <table cellpadding="0" cellspacing="0" border="0" width="100%">
                                                          <tr>
                                                            <td width="20" align="left"></td>
                                                            <td width="32" align="left"><a href="https://slack.com/slack-tips/submit-and-approve-expenses?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                target="_blank"><img src="https://image.email.slack.com/lib/fe5515707c610d7b7312/m/1/39c5a236-bd61-4a67-9c54-45050be46658.png" alt="Submit" border="0" style="display:block;" width="32"></a></td>
                                                            <td width="20" align="left"></td>
                                                            <td width="480" align="left" style="font-size: 18px; font-family: 'Source Sans Pro', Calibri, sans-serif; color:#1a1938;"><a href="https://slack.com/slack-tips/submit-and-approve-expenses?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                targe="_blank" style="text-decoration:none;color:#1a1938 !important;">Submit and approve expenses</a></td>
                                                            <td width="20" align="left"></td>
                                                            <td width="10" align="left"><a href="https://slack.com/slack-tips/submit-and-approve-expenses?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                targe="_blank" style="text-decoration:none;color:#1a1938 !important;"><img src="https://image.email.slack.com/lib/fe5515707c610d7b7312/m/1/4a151d5c-1e43-4d69-b9cc-52dc4ce57dc9.png" alt="cta3b" border="0" style="display:block;" width="10"></a></td>
                                                            <td width="18" align="left"></td>
                                                          </tr>
                                                        </table>
                                                      </td>
                                                    </tr>
                                                    <tr>
                                                      <td height="10" style="border-collapse:collapse;"></td>
                                                    </tr>
                                                    <tr>
                                                      <td align="center">
                                                        <HR width="100%" align="center" style="color:rgba(255, 0, 0, 0.3)">
                                                      </td>
                                                    </tr>
                                                    <tr>
                                                      <td height="10" style="border-collapse:collapse;"></td>
                                                    </tr>
                                                    <tr>
                                                      <td align="center">
                                                        <table cellpadding="0" cellspacing="0" border="0" width="100%">
                                                          <tr>
                                                            <td width="20" align="left"></td>
                                                            <td width="32" align="left"><a href="https://slack.com/slack-tips/share-account-details-from-your-crm?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                target="_blank"><img src="https://image.email.slack.com/lib/fe5515707c610d7b7312/m/1/d1b37667-30f4-49d8-b546-4581b56caebd.png" alt="Share" border="0" style="display:block;" width="32"></a></td>
                                                            <td width="20" align="left"></td>
                                                            <td width="480" align="left" style="font-size: 18px; font-family: 'Source Sans Pro', Calibri, sans-serif; color:#1a1938;"><a href="https://slack.com/slack-tips/share-account-details-from-your-crm?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                targe="_blank" style="text-decoration:none;color:#1a1938 !important;">Share account details from your CRM</a></td>
                                                            <td width="20" align="left"></td>
                                                            <td width="10" align="left"><a href="https://slack.com/slack-tips/share-account-details-from-your-crm?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                targe="_blank" style="text-decoration:none;color:#1a1938 !important;"><img src="https://image.email.slack.com/lib/fe5515707c610d7b7312/m/1/4a151d5c-1e43-4d69-b9cc-52dc4ce57dc9.png" alt="cta4b" border="0" style="display:block;" width="10"></td>
      <td width="18" align="left"></td>
     </tr>
       </table>
      </td>
     </tr>
     <tr>
      <td height="10" style="border-collapse:collapse;"></td>
     </tr>
     <tr>
      <td align="center">
       <HR width="100%" align="center" style="color:rgba(255, 0, 0, 0.3)">
      </td>
     </tr>
     <tr>
      <td height="10" style="border-collapse:collapse;"></td>
     </tr>
     <tr>
      <td align="center">
       <table cellpadding="0" cellspacing="0" border="0" width="100%">
     <tr>
      <td width="20" align="left"></td>
      <td width="32" align="left"><a href="https://slack.com/slack-tips/welcome-new-employees-to-your-team?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810" target="_blank"><img src="https://image.email.slack.com/lib/fe5515707c610d7b7312/m/1/d3f5ae7a-fcc1-43a6-b57e-5c8105cf52ed.png" alt="Welcome" border="0" style="display:block;" width="32"></a></td>
                                                            <td width="20" align="left"></td>
                                                            <td width="480" align="left" style="font-size: 18px; font-family: 'Source Sans Pro', Calibri, sans-serif; color:#1a1938;"><a href="https://slack.com/slack-tips/welcome-new-employees-to-your-team?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                targe="_blank" style="text-decoration:none;color:#1a1938 !important;">Welcome new employees to your team</a></td>
                                                            <td width="20" align="left"></td>
                                                            <td width="10" align="left"><a href="https://slack.com/slack-tips/welcome-new-employees-to-your-team?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"
                                                                targe="_blank" style="text-decoration:none;color:#1a1938 !important;"><img src="https://image.email.slack.com/lib/fe5515707c610d7b7312/m/1/4a151d5c-1e43-4d69-b9cc-52dc4ce57dc9.png" alt="cta5b" border="0" style="display:block;" width="10"></td>
      <td width="18" align="left"></td>
     </tr>
       </table>
      </td>
     </tr>
     <tr>
      <td height="10" style="border-collapse:collapse;"></td>
     </tr>
     <tr>
      <td align="center">
       <HR width="100%" align="center" style="color:rgba(255, 0, 0, 0.3)">
      </td>
     </tr>

        <tr>
       <td height="46" style="border-collapse:collapse;"></td>
        </tr>
     
    <tr>
     <td align="center">
      <!-- CTA Right -->
      <div style="width:100%;max-width:340px;display:inline-block;vertical-align:top;align:left;">
      <table style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;"       width="100%" align="left" class="container">
       <tr>
     <td style="border-collapse:collapse;text-align:center;" align="left">
      <div>
      <!--[if mso]>       <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="https://slack.com/slack-tips?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"  arcsize="7%" strokecolor="#611F69" fillcolor="#611F69" style="height:50px;v-text-anchor:middle;width:340px;margin-bottom:30px !important;" >       <w:anchorlock/>       <center style="color:#ffffff;font-family:Arial,sans-serif;font-size:20px;font-weight:900;" >       View All Tips       </center>       
</v:roundrect>       <![endif]-->
      <a href="https://slack.com/slack-tips?cvosrc=email.email.email_slack_tips_announcement&cvo_creative=slacktips_intro_email_imagefirst&utm_medium=email&utm_source=email&utm_campaign=d_email_email_us_en__ob-null_cr-slacktips_intro_email_imagefirst_ym-201810"  class="CTA-Secondary" style="font-family:Helvetica, 'Helvetica Neue', Arial, 'Lato', sans-serif;background-color:#611F69;background-image:none;background-repeat:repeat;background-position:top left;background-attachment:scroll;border-width:1px;border-style:solid;border-color:#611F69;border-radius:4px;color:#ffffff;display:inline-block;font-size:20px;font-weight:900;line-height:50px;text-align:center;text-decoration:none;width:340px;min-width:234px;-webkit-text-size-adjust:none;mso-hide:all;">View All Tips</a>
                              </div>
                              </td>
                              </tr>
                              </table>
                      </div>
                      <!-- /CTA Right -->
                      <!--[if (gte mso 9)|(IE)]>       </td>       </tr>       </table>       <![endif]-->
                      </td>
                      </tr>

                      <tr>
                        <td height="46" style="border-collapse:collapse;"></td>
                      </tr>

                      </table>
                      </td>
                      </tr>

                      </table>
                      </td>
                      </tr>
                      </table>

                      <table class="responsive-tableb" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;" width="100%" cellspacing="0" cellpadding="0" border="0" align="center">
                        <tr>
                          <td class="font text-align-center font-footer grey pad-40-0-0-0" style="border-collapse:collapse;font-family:Helvetica, 'Helvetica Neue', Arial, sans-serif;-webkit-font-smoothing:antialiased;font-size:15px;line-height:24px;padding-top:40px;padding-bottom:0;padding-right:0;padding-left:0;text-align:center;color:#999999;">

                            Made by <a href="/" target="_blank" class="dark-grey hover" style="color:#565759;text-decoration:none;">Slack Technologies, Inc.</a>
                            <br>
                            <span class="foot-addr" style="display:block;">500 Howard Street&nbsp;&nbsp;</span>San Francisco, CA 94105
                            <br>
                            <br>
                            <a href="https://slackhq.com/" target="_blank" class="dark-grey hover" style="color:#565759;text-decoration:none;">Our Blog</a> &nbsp;&nbsp;
                            <span style="color:#d8d8d8;">•</span> &nbsp;&nbsp;
                            <a href="#" target="_blank" class="dark-grey hover" style="color:#565759;text-decoration:none;">Unsubscribe</a> &nbsp;&nbsp;
                            <span class="light-grey" style="color:#d8d8d8;">•</span> &nbsp;&nbsp;
                            <a href="/legal" target="_blank" class="dark-grey hover" style="color:#565759;text-decoration:none;">Policies</a>
                          </td>
                        </tr>
                      </table>
                      </td>
                      </tr>
                      </table>
        </div>
        </td>
        </tr>
        </table>
        </div>
        </td>
        </tr>
        </table>
        </td>
        </tr>
        </table>
        </div>
      </td>
    </tr>
  </table>

</body>

</html>
            
          
!
999px
🕑 One or more of the npm packages you are using needs to be built. You're the first person to ever need it! We're building it right now and your preview will start updating again when it's ready.

Console