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.

            
              <head>
  <title>Facebook</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <style>
    @media all and (max-width: 480px){*[class].ib_t{min-width:100% !important}*[class].ib_row{display:block !important}*[class].ib_ext{display:block !important;padding:10px 0 5px 0;vertical-align:top !important;width:100% !important}*[class].ib_img,*[class].ib_mid{vertical-align:top !important}*[class].mb_blk{display:block !important;padding-bottom:10px;width:100% !important}*[class].mb_hide{display:none !important}*[class].mb_inl{display:inline !important}}.d_mb_show{display:none}.d_mb_show_center{display:table;margin:auto}@media only screen and (max-device-width: 480px){.d_mb_hide{display:none !important}.d_mb_show{display:block !important}}.mb_text h1,.mb_text h2,.mb_text h3,.mb_text h4,.mb_text h5,.mb_text h6{line-height:normal}.mb_work_text h1{font-size:18px;line-height:normal;margin-top:4px}.mb_work_text h2,.mb_work_text h3{font-size:16px;line-height:normal;margin-top:4px}.mb_work_text h4,.mb_work_text h5,.mb_work_text h6{font-size:14px;line-height:normal}.mb_work_text a{color:#1270e9}.mb_work_text p{margin-top:4px}
  </style>
  <style type="text/css">
  </style>
</head>

<body style="margin:0;padding:0;" dir="ltr" bgcolor="#ffffff">
  <table border="0" width="100%;" cellspacing="0" cellpadding="0" id="email_table" style="border-collapse:collapse;">
    <tbody>
      <tr>
        <td id="email_content" style="font-family:Helvetica Neue,Helvetica,Lucida Grande,tahoma,verdana,arial,sans-serif;background:#ffffff;">
          <table border="0" width="100%" cellspacing="0" cellpadding="0" style="border-collapse:collapse;">
            <tbody>
              <tr style="">
                <td height="20" style="line-height:20px;" colspan="3">&nbsp;</td>
              </tr>
              <tr>
                <td height="1" colspan="3" style="line-height:1px;"><span style="color:#FFFFFF;display:none !important;font-size:1px;">&nbsp; Your account has been created — now it will be easier than ever to share and connect with your friends. &nbsp; Here are three ways for you to get the most out of it: &nbsp; Find Friends Find people you know on Facebook using our simple tools. Upload a Profile Photo Personalize your profile and help your friends recognize you. Edit Your Profile Describe personal interests, contact information, and affiliations. &nbsp;</span></td>
              </tr>
              <tr>
                <td width="15" style="display:block;width:15px;">&nbsp;&nbsp;&nbsp;</td>
                <td style="">
                  <table border="0" width="100%" cellspacing="0" cellpadding="0" style="border-collapse:collapse;">
                    <tbody>
                      <tr style="">
                        <td height="16" style="line-height:16px;" colspan="3">&nbsp;</td>
                      </tr>
                      <tr>
                        <td width="32" align="left" valign="middle" style="height:32;line-height:0px;">
                          <a href="https://www.facebook.com/n/?find-friends%2F&amp;medium=email&amp;mid=54d7becc818d6G5af6ec7244d0G0G4b&amp;bcode=1.1492570766.AbnRI71jcKLCSoQu&amp;n_m=&amp;lloc=email" style="color:#3b5998;text-decoration:none;"
                            target="_blank"><img src="https://www.facebook.com/rsrc.php/v3/yk/r/_2faPUZhPI6.png" width="32" height="32" style="border:0;"></a>
                        </td>
                        <td width="15" style="display:block;width:15px;">&nbsp;&nbsp;&nbsp;</td>
                        <td width="100%" style=""><a href="https://www.facebook.com/n/?find-friends%2F&amp;medium=email&amp;mid=54d7becc818d6G5af6ec7244d0G0G4b&amp;bcode=1.1492570766.AbnRI71jcKLCSoQu&amp;n_m=&amp;lloc=email" style="color:#3b5998;text-decoration:none;font-family:Helvetica Neue,Helvetica,Lucida Grande,tahoma,verdana,arial,sans-serif;font-size:19px;line-height:32px;"
                            target="_blank">Facebook</a></td>
                      </tr>
                      <tr style="border-bottom:solid 1px #e5e5e5;">
                        <td height="16" style="line-height:16px;" colspan="3">&nbsp;</td>
                      </tr>
                    </tbody>
                  </table>
                </td>
                <td width="15" style="display:block;width:15px;">&nbsp;&nbsp;&nbsp;</td>
              </tr>
              <tr>
                <td width="15" style="display:block;width:15px;">&nbsp;&nbsp;&nbsp;</td>
                <td style="">
                  <table border="0" width="100%" cellspacing="0" cellpadding="0" style="border-collapse:collapse;">
                    <tbody>
                      <tr style="">
                        <td height="28" style="line-height:28px;">&nbsp;</td>
                      </tr>
                      <tr>
                        <td style=""><span class="mb_text" style="font-family:Helvetica Neue,Helvetica,Lucida Grande,tahoma,verdana,arial,sans-serif;font-size:16px;line-height:21px;color:#141823;">Your account has been created — now it will be easier than ever to share and connect with your friends.</span></td>
                      </tr>
                      <tr style="">
                        <td height="14" style="line-height:14px;">&nbsp;</td>
                      </tr>
                      <tr>
                        <td style=""><span class="mb_text" style="font-family:Helvetica Neue,Helvetica,Lucida Grande,tahoma,verdana,arial,sans-serif;font-size:16px;line-height:21px;font-weight:bold;color:#141823;">Here are three ways for you to get the most out of it:</span></td>
                      </tr>
                      <tr style="">
                        <td height="14" style="line-height:14px;">&nbsp;</td>
                      </tr>
                      <tr>
                        <td style="">
                          <table border="0" width="100%" cellspacing="0" cellpadding="0" style="border-collapse:collapse;">
                            <tbody>
                              <tr>
                                <td style="font-size:11px;font-family:LucidaGrande,tahoma,verdana,arial,sans-serif;border:solid 1px #e5e5e5;border-radius:2px;padding:10px;display:block;">
                                  <table border="0" cellspacing="0" cellpadding="7" style="border-collapse:collapse;">
                                    <tbody>
                                      <tr>
                                        <td style="">
                                          <table border="0" width="100%" cellspacing="0" cellpadding="0" align="left" class="ib_t" style="border-collapse:collapse;min-width:420px;">
                                            <tbody>
                                              <tr class="ib_row">
                                                <td valign="top" style="padding-right:10px;font-size:0px;" class="ib_img"><img src="https://www.facebook.com/rsrc.php/v3/yP/r/TgR7WGzB2KD.gif" style="border:0;"></td>
                                                <td width="100%" valign="top" style="padding-right:10px;" class="ib_mid"><span class="mb_text" style="font-family:Helvetica Neue,Helvetica,Lucida Grande,tahoma,verdana,arial,sans-serif;font-size:16px;line-height:21px;color:#141823;"><a href="https://www.facebook.com/n/?find-friends%2F&amp;medium=email&amp;mid=54d7becc818d6G5af6ec7244d0G0G4b&amp;bcode=1.1492570766.AbnRI71jcKLCSoQu&amp;n_m=" style="color:#3b5998;text-decoration:none;" target="_blank">Find Friends</a></span><br>
                                                  <span
                                                    class="mb_text" style="font-family:Helvetica Neue,Helvetica,Lucida Grande,tahoma,verdana,arial,sans-serif;font-size:14px;line-height:19px;color:#898f9c;">Find people you know on Facebook using our simple tools.</span>
                                                </td>
                                              </tr>
                                            </tbody>
                                          </table>
                                        </td>
                                      </tr>
                                      <tr>
                                        <td style="">
                                          <table border="0" width="100%" cellspacing="0" cellpadding="0" align="left" class="ib_t" style="border-collapse:collapse;min-width:420px;">
                                            <tbody>
                                              <tr class="ib_row">
                                                <td valign="top" style="padding-right:10px;font-size:0px;" class="ib_img"><img src="https://www.facebook.com/rsrc.php/v3/yN/r/Btw6qZ0ihGS.gif" style="border:0;"></td>
                                                <td width="100%" valign="top" style="padding-right:10px;" class="ib_mid"><span class="mb_text" style="font-family:Helvetica Neue,Helvetica,Lucida Grande,tahoma,verdana,arial,sans-serif;font-size:16px;line-height:21px;color:#141823;"><a href="https://www.facebook.com/n/?profile.php&amp;medium=email&amp;mid=54d7becc818d6G5af6ec7244d0G0G4b&amp;bcode=1.1492570766.AbnRI71jcKLCSoQu&amp;n_m=" style="color:#3b5998;text-decoration:none;" target="_blank">Upload a Profile Photo</a></span><br>
                                                  <span
                                                    class="mb_text" style="font-family:Helvetica Neue,Helvetica,Lucida Grande,tahoma,verdana,arial,sans-serif;font-size:14px;line-height:19px;color:#898f9c;">Personalize your profile and help your friends recognize you.</span>
                                                </td>
                                              </tr>
                                            </tbody>
                                          </table>
                                        </td>
                                      </tr>
                                      <tr>
                                        <td style="">
                                          <table border="0" width="100%" cellspacing="0" cellpadding="0" align="left" class="ib_t" style="border-collapse:collapse;min-width:420px;">
                                            <tbody>
                                              <tr class="ib_row">
                                                <td valign="top" style="padding-right:10px;font-size:0px;" class="ib_img"><img src="https://www.facebook.com/rsrc.php/v3/y-/r/oXpwcGCi58A.gif" style="border:0;"></td>
                                                <td width="100%" valign="top" style="padding-right:10px;" class="ib_mid"><span class="mb_text" style="font-family:Helvetica Neue,Helvetica,Lucida Grande,tahoma,verdana,arial,sans-serif;font-size:16px;line-height:21px;color:#141823;"><a href="https://www.facebook.com/n/?profile.php&amp;v=info&amp;edit_info=all&amp;medium=email&amp;mid=54d7becc818d6G5af6ec7244d0G0G4b&amp;bcode=1.1492570766.AbnRI71jcKLCSoQu&amp;n_m=" style="color:#3b5998;text-decoration:none;" target="_blank">Edit Your Profile</a></span><br>
                                                  <span
                                                    class="mb_text" style="font-family:Helvetica Neue,Helvetica,Lucida Grande,tahoma,verdana,arial,sans-serif;font-size:14px;line-height:19px;color:#898f9c;">Describe personal interests, contact information, and affiliations.</span>
                                                </td>
                                              </tr>
                                            </tbody>
                                          </table>
                                        </td>
                                      </tr>
                                    </tbody>
                                  </table>
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>
                      <tr style="">
                        <td height="14" style="line-height:14px;">&nbsp;</td>
                      </tr>
                    </tbody>
                  </table>
                </td>
                <td width="15" style="display:block;width:15px;">&nbsp;&nbsp;&nbsp;</td>
              </tr>
              <tr>
                <td width="15" style="display:block;width:15px;">&nbsp;&nbsp;&nbsp;</td>
                <td style="">
                  <table border="0" width="100%" cellspacing="0" cellpadding="0" style="border-collapse:collapse;">
                    <tbody>
                      <tr style="">
                        <td height="2" style="line-height:2px;" colspan="3">&nbsp;</td>
                      </tr>
                      <tr>
                        <td class="mb_blk" style="">
                          <a href="https://www.facebook.com/n/?find-friends%2F&amp;medium=email&amp;mid=54d7becc818d6G5af6ec7244d0G0G4b&amp;bcode=1.1492570766.AbnRI71jcKLCSoQu&amp;n_m=&amp;lloc=email" style="color:#3b5998;text-decoration:none;"
                            target="_blank">
                            <table border="0" width="100%" cellspacing="0" cellpadding="0" style="border-collapse:collapse;">
                              <tbody>
                                <tr>
                                  <td style="border-collapse:collapse;border-radius:2px;text-align:center;display:block;border:solid 1px #344c80;box-shadow:inset 0 1px 1px rgba(255, 255, 255, 0.1),0 1px 0 rgba(0, 0, 0, 0.1);background:#4c649b;padding:7px 16px 11px 16px;">
                                    <a href="https://www.facebook.com/n/?find-friends%2F&amp;medium=email&amp;mid=54d7becc818d6G5af6ec7244d0G0G4b&amp;bcode=1.1492570766.AbnRI71jcKLCSoQu&amp;n_m=&amp;lloc=email" style="color:#3b5998;text-decoration:none;display:block;"
                                      target="_blank">
                                      <center>
                                        <font size="3"><span style="font-family:Helvetica Neue,Helvetica,Lucida Grande,tahoma,verdana,arial,sans-serif;white-space:nowrap;font-weight:bold;vertical-align:middle;color:#ffffff;text-shadow:0 -1px 0 #415686;font-size:14px;line-height:14px;">Get&nbsp;Started</span></font>
                                      </center>
                                    </a>
                                  </td>
                                </tr>
                              </tbody>
                            </table>
                          </a>
                        </td>
                        <td width="100%" class="mb_hide" style=""></td>
                      </tr>
                      <tr style="">
                        <td height="32" style="line-height:32px;" colspan="3">&nbsp;</td>
                      </tr>
                    </tbody>
                  </table>
                </td>
                <td width="15" style="display:block;width:15px;">&nbsp;&nbsp;&nbsp;</td>
              </tr>
              <tr>
                <td width="15" style="display:block;width:15px;">&nbsp;&nbsp;&nbsp;</td>
                <td style="">
                  <table border="0" width="100%" cellspacing="0" cellpadding="0" style="border-collapse:collapse;">
                    <tbody>
                      <tr style="border-top:solid 1px #e5e5e5;">
                        <td height="16" style="line-height:16px;">&nbsp;</td>
                      </tr>
                      <tr>
                        <td style="font-family:Helvetica Neue,Helvetica,Lucida Grande,tahoma,verdana,arial,sans-serif;font-size:11px;color:#aaaaaa;line-height:16px;">This message was sent to <a href="mailto:" style="color:#3b5998;text-decoration:none;" target="_blank">hello@SmilesDavis.yeah</a>. If you don't want to receive these emails from Facebook in the future,
                          please <a href="#" style="color:#3b5998;text-decoration:none;" target="_blank">unsubscribe</a>.<br>Facebook, Inc.,
                          Attention: Community Support, 1 Hacker Way, Menlo Park, CA 94025</td>
                      </tr>
                    </tbody>
                  </table>
                </td>
                <td width="15" style="display:block;width:15px;">&nbsp;&nbsp;&nbsp;</td>
              </tr>
              <tr style="">
                <td height="20" style="line-height:20px;" colspan="3">&nbsp;</td>
              </tr>
            </tbody>
          </table><span style=""></span></td>
      </tr>
    </tbody>
  </table>


</body>
            
          
!
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