title: Font outline using only CSS
body: <p>I'm working on adding a black font outline to white text using CSS. The goal is the image below. So far I've been able to come up with below. Is there any other best practice to closer match the thin outline shown in the image below? Thanks!  </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.introText {
  font-family: 'Nunito', sans-serif;
  -moz-text-fill-color: white;
  -webkit-text-fill-color: white;
  -moz-text-stroke-color: black;
  -webkit-text-stroke-color: black;
  -moz-text-stroke-width: 2px;  
  -webkit-text-stroke-width: 2px;
  font-size: 50px;
  margin-top: 20vh;
  }
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;h1 class='introText text-center'&gt;We've got your perfect spot.&lt;/h1&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p><a href="https://i.stack.imgur.com/SX0Xt.png" rel="noreferrer"><img src="https://i.stack.imgur.com/SX0Xt.png" alt="enter image description here"></a></p>