Shadows
I hope you enjoy reading this post. If you'd like to work together Contact Me
Author: Joe Czubiak | Creator of Barnacles | Serial Indie Maker
Shadows: shadows.joeczubiak.com
GitHub: github.com/jcz530/shadows
I built an open-source CSS box-shadow generator.
I was curious about box shadows one day. Some visual code editors like WebFlow let you specify angle and distance for box shadows but both angle and distance aren't CSS attributes on box-shadow. So I decided to explore how angle and distance are converted to an x and y offset.
I started to write an article detailing the math behind it, turns out it's basic trigonometry and if I was still in 9th grade it would have been obvious to me. Before you know it and before the article is done I built and released my own CSS generator.
One of the lessons I learned while exploring what makes a good box-shadow is that opacity and layers are the keys. Most box-shadow generators online don't allow multiple shadows to be specified and the preview they give doesn't look like something you'd use in your own UI.
So I built something that I think is better. Take a look.
