CSS Art Tutorial: Create the Flushed Emoji With Only 3 Classes! 😳
Introduction
In this article, I'm describing how to create the flush emoji with only 3 HTML classes. 😳
The emoji will have a head, eyes, cheeks, and a mouth. In the end, we'll add some animations for the eyes too!
Tools and resources:
I'm using cod...
eleftheriabatsou.hashnode.dev10 min read
Maciek Fitzner
I like trying out what CSS can do. And making it do things it wasn't meant for.
The blush on each cheek done via a box-shadow of the eyes was a very clever trick! If I may suggest a slight tech tweak, maybe add a overflow: hidden to the face, so that the blush doesn't spill over to the background on hover (this'd also require making the eyes pop out a little less so as not to get cut off). Also, just for mood consistency, on hover, rather than eyes popping out, the emoji could blush even more and look down as if abashed. Overall a really fun and informative piece, and definitely an inspiration :)