title: Any ideas about how to use CSS to emulate a messy stamp?
body: <p>I'm interested in ways to render a span that to look something like one of these:</p>
  
  <p><img src="https://i.stack.imgur.com/aGCSB.png" alt="some random images of stamps"></p>
  
  <p>Here are the tricks I plan on using:</p>
  
  <ul>
  <li><code>@font-face</code></li>
  <li><code>-{moz/webkit/o}-transform:rotate</code></li>
  </ul>
  
  <p>It's for a personal project so assuming the most modern CSS support is fine. Maybe border-images could help? I'd like to avoid image splicing all over the place -- if it really comes down to that I'll just skip the border all together and rely on a font for the look.</p>
  
  <p>I'm just curious how the CSS gurus around here would approach this.</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>There is now a CSS property for this, <code>mask-image</code>. More <a href="http://trentwalton.com/2011/05/19/mask-image-text/" rel="noreferrer">here</a>.</p>