Daily CSS Images: Day 4
Guess what it is…
It’s a tiger!
It took a lot longer than the others. I added a lot more detail than I have in previous days and did a lot more planning.
As you can see, I planned out the CSS classes I would need and the variables I would use in those classes. I also planned the unusual shapes as well by pointing to them on the sketch.
The tiger ended up a little bit different than I planned. I used a linear gradient to apply the stripes on almost everything, so I didn’t get the look I drew. The ears and tail were made by using the border style of “dotted” with a solid black border underneath.
These two tricks were specifically learned for this tiger. I wanted to be “lazy” and not draw a stripe everywhere I wanted a stripe, so I learned how to use the linear gradient to achieve the look.
Below is the codepen for the Tiger
As always, comments and improvements are appreciated!