Last Updated: February 25, 2016
·
1.401K
· dfross

Sass Mixin for Letterpress Text Effect

Here's a simple Sass mixin I use often in projects when I want to give headings a subtle letterpress effect. By default this applies a 1 pixel white text shadow just below the text at 50% opacity. You can, of course, set your own opacity value at time of inclusion.

@mixin letterpress($opacity: 0.5) {
  @include text-shadow(0 1px 0 rgba(255,255,255,$opacity));
}

Example: http://codepen.io/dfross/pen/mknog