DEV Community

Cover image for Drawing a butterfly with HTML and CSS
Alvaro Montoro
Alvaro Montoro

Posted on

Drawing a butterfly with HTML and CSS

I really enjoyed drawing today's illustration in HTML and CSS... although I must admit that I don't know much about butterflies and probably made a ton of mistakes. For starters, I don't think monarch butterflies have that eye on their wings, but let's not get too technical.

It also has a gentle animation with the wings flapping slightly as butterflies do sometimes (or always, as I said, not an expert here :P)

Here it is the CodePen with the illustration:

Here it is the video of how it was coded:

Top comments (4)

Collapse
 
ic1101virgo profile image
Anjali Chaturvedi

This is so beautiful! I am going to try this. Thank you :)

Collapse
 
alvaromontoro profile image
Alvaro Montoro

Thanks! Please share what you end up doing 😊

Collapse
 
ic1101virgo profile image
Anjali Chaturvedi

Absolutely!

Collapse
 
waylonwalker profile image
Waylon Walker

css art is just mind blowing