SCSS Mixin for Text Shadows

Another simple SCSS mixin for setting text shadows on an element, includes parameters for:

  • X Offset
  • Y Offset
  • Blur
  • RGBA Color

 

@mixin text-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4)) {
    text-shadow: $x $y $blur $color;
}

Usage

.h1{
@include text-shadow(2, 2, 5, rgba(0,0,0,.4))
}