<div class="wrapper">
  <main>
    <h1>Twemoji 2.5</h1>
    <div class="emojis">
      👀️ ❤️ 🦄️ 
      <p>= I love unicorns.</p>
    </div>
  </main>
</div>
html {
  height: 100%;
}

body {
  font-family: "-apple-system", BlinkMacSystemFont, "Segoe UI", "Roboto",
    "Oxygen", "Ubuntu", sans-serif;
  min-height: 100%;
}

.wrapper {
  width: 100%;
  padding: 1em;
  color: black;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  h1 {
    font-size: 1.5em;
    margin-bottom: 1em;
  }

  .emojis {
    margin-bottom: 1em;
    font-size: 2em;
    img.emoji {
      height: 1em;
      width: 1em;
      margin: 0 0.2em;
      vertical-align: -0.1em;
    }
    p {
      font-weight: lighter;
    }
  }
}
View Compiled
twemoji.parse(document.body, {
  folder: "svg",
  ext: ".svg"
});
Run Pen

External CSS

  1. https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css

External JavaScript

  1. https://twemoji.maxcdn.com/2/twemoji.min.js?2..0