CSS/Stylus Text Borders
Somehow I couldn't google for this, so I just wrote it. Uses stylus, teh best CSS preprocessor.
text-border(quality, width, blur-radius, border-color)
steps = quality*2
shadows = ''
for d in 0..steps*2
shadows += '%s %s %s %s %s' % (unquote(d?',':'') round(sin(PI * d/steps)*width, 6) round(cos(PI * d/steps)*width, 6) blur-radius border-color)
unquote(shadows)
Use the quality variable to increase the number of shadows used. (# of shadows = quality * 4). Finally, a purpose for high school trig!
If there's a more stylus-onic way to do this, let me know!
Preview: http://cdpn.io/ltEpB
Written by Jordan Klassen
Related protips
Have a fresh tip? Share with Coderwall community!
Post
Post a tip
Best
#Css
Authors
Sponsored by #native_company# — Learn More
#native_title#
#native_desc#