ms-Dialog

<button class="ms-Button js-DialogAction--open" data-target=".ms-Dialog--sample"> 
  <span class="ms-Button-icon"><i class="ms-Icon ms-Icon--plus"></i></span> 
  <span class="ms-Button-label">Open Dialog</span> 
  <span class="ms-Button-description">Opens the Sample Dialog</span> 
</button> 
<div class="ms-Dialog ms-Dialog--sample"> 
  <div class="ms-Overlay ms-Overlay--dark js-DialogAction--close"></div> 
  <div class="ms-Dialog-main"> 
    <button class="ms-Dialog-button ms-Dialog-button--close js-DialogAction--close"> 
      <i class="ms-Icon ms-Icon--x"></i> 
    </button> 
    <div class="ms-Dialog-header"> 
      <p class="ms-Dialog-title">All emails together</p> 
    </div> 
    <div class="ms-Dialog-inner"> 
      <div class="ms-Dialog-content"> 
        <p class="ms-Dialog-subText">Your Inbox has changed. No longer does it include favorites, it is a singular destination for your emails.</p> 
        <div class="ms-ChoiceField"> 
          <input class="ms-ChoiceField-input" id="demo-checkbox-unselected1" type="checkbox"> 
          <label class="ms-ChoiceField-field" for="demo-checkbox-unselected1"><span class="ms-Label">Option1</span></label> 
        </div> 
        <div class="ms-ChoiceField"> 
          <input class="ms-ChoiceField-input" id="demo-checkbox-unselected2" type="checkbox"> 
          <label class="ms-ChoiceField-field" for="demo-checkbox-unselected2"><span class="ms-Label">Option2</span></label> 
        </div> 
      </div> 
      <div class="ms-Dialog-actions"> 
        <div class="ms-Dialog-actionsRight"> 
          <button class="ms-Dialog-action ms-Button ms-Button--primary"> 
            <span class="ms-Button-label">Save</span> 
          </button> 
          <button class="ms-Dialog-action ms-Button"> 
            <span class="ms-Button-label">Cancel</span> 
          </button> 
        </div> 
      </div> 
    </div> 
  </div> 
</div> 

<script type="text/javascript"> 
$(document).ready(function() { 
   if ($.fn.Dialog) { 
      $('.ms-Dialog'}.Dialog();  
   } 
}); 
</script> 

Modal vs Modeless