Skip to content

Instantly share code, notes, and snippets.

@skttl
Created December 7, 2017 11:31
Show Gist options
  • Save skttl/3a1ddf20d69a841962d96856cb3d12c0 to your computer and use it in GitHub Desktop.
Save skttl/3a1ddf20d69a841962d96856cb3d12c0 to your computer and use it in GitHub Desktop.
SCSS mixin for outlining text
@mixin outline-text($width:1px, $color:#fff) {
$text-shadow-result: "0 0 0 #{$color}";
@for $y from -$width through $width {
@for $x from -$width through $width {
$text-shadow-result: #{append($text-shadow-result, ", #{$y} #{$x} 0 #{$color}")};
}
}
text-shadow:$text-shadow-result;
}
/*
USAGE:
.outlined {
@include outline-text(2px, #fff);
}
*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment