title: How do you create white inset text?
body: <p>Creating dark inset text is simple. You just write the same word twice (using text-shadow in this case) but the second time you write it drop it down and to the right a little bit and write it in a lighter color with some opacity. Easy once you figure it out. </p>
  
  <p>The problem I am having is with white inset text. There is no color whiter than white so there is no way to create the illusion of more light being at the top than down inside the inset character. The best I can come up with is white outset text but I want white inset text.</p>
  
  <pre><code>.dark {
      color:rgba(0, 0, 0, .6);
      text-shadow:2px 2px rgba(255, 255, 255, .1);
  }
  .light {
      color:rgba(200, 200, 200, 1);
      text-shadow:2px 2px rgba(0, 0, 0, .2);
  }
  </code></pre>
  
  <p>​</p>
  
  <p><a href="http://jsfiddle.net/TcmAy/4/" rel="nofollow noreferrer">fiddle</a></p>
  
  <p><img src="https://i.stack.imgur.com/YZ45h.png" alt="enter image description here"></p>
  
  <p>Found an answer on IRC <a href="http://jsfiddle.net/TcmAy/7/" rel="nofollow noreferrer">fiddle</a>
  the light is hitting from the top left so it looks darker where the tl z axis would be</p>