100 Days of CSS Illustrations (21-30)
Tags: css, art, html, showdev
Published: 2020-09-03 12:48:01

---
title: 100 Days of CSS Illustrations (21-30)
published: true
description: Days 21-30 of the 100 days of CSS illustrations challenge.
tags: CSS,art,html,showdev
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/kv20sd2pzszc9v3b7fc3.png
series: 100 days of CSS illustrations
---

This week was a busy one at work, and I barely made the 10 illustrations for this batch. Most of them are my own compared to other times that I based more on Dribble.

Here are the 10 illustrations/drawings I did in the past 10 days. **Click on the image to see the full illustration with the code**, and [click here to see a CodePen collection with all of the drawings plus some variations](https://codepen.io/collection/AOaOdx).

## Day 21: Angel & Demon

The first version of these characters was from 2010, when I started developing a Bible trivia game (that never saw the light of day).  The original ones are smoother and curvier, and have arms too :P

[![Cartoon of an angel and a demon](https://dev-to-uploads.s3.amazonaws.com/i/sc34ndt869d6psjp6oym.png)](https://codepen.io/alvaromontoro/full/jOqBPwr)

## Day 22: Pucca

[Pucca](https://en.wikipedia.org/wiki/Pucca) is a popular character created by VOOZ. It was originally an online e-card service but soon extended to web animations, games, TV shows... I almost missed this day, so I ended up going for something _easy_.

[![Illustration of the cartoon character Pucca](https://dev-to-uploads.s3.amazonaws.com/i/hb1qp5iilvl5liq757zg.png)](https://codepen.io/alvaromontoro/full/gOrWOXr)

## Day 23: Dog from letters

I tried to do something similar to what I did with [this owl](https://codepen.io/alvaromontoro/full/ZEWLvLY), but I failed. Sometimes you have days to draw and love it, and some days you hate the result. This was one of the latter... maybe I'll try to redo a different day.

[![Minimalistic cartoon of a dog](https://dev-to-uploads.s3.amazonaws.com/i/teue1mjvtx3gmuuywqz3.png)](https://codepen.io/alvaromontoro/full/MWymEzJ)

## Day 24: Cartoon character

Another customizable cartoon (change the CSS variables on line 33) with a manga-esque look. You can [see how I coded it on this video](https://www.youtube.com/watch?v=e7Kw3OX-Lns)

[![Cartoon of a person smiling softly](https://dev-to-uploads.s3.amazonaws.com/i/w6a59s3nyf675i2qyqk7.png)](https://codepen.io/alvaromontoro/full/MWyoWXQ)

## Day 25: Bender Bending Rodríguez

Futurama is(/was/is?) an amazing TV show, and gave us one of the most iconic animation characters ever: Bender! Unfortunately, I used `drop-shadow` and some `transform` that makes the cartoon look terrible on some browsers.

[![Cartoon depicting Bender from the TV show Futurama](https://dev-to-uploads.s3.amazonaws.com/i/58xnsynpfl9781jjqmav.png)](https://codepen.io/alvaromontoro/full/WNwpWvy)

## Day 26: Hello... I guess...

Another cartoon that was done in a hurry... so it's not that great, plus it uses `drop-shadow` so it won't work in all browsers. 😬😰

[![Cartoon showing a man with a speech bubble with the text "Hello... I guess..."](https://dev-to-uploads.s3.amazonaws.com/i/iyy5dddxu9ih35n4wudg.png)](https://codepen.io/alvaromontoro/full/zYqzgoy)


## Day 27: Man's face

I drew this one in a hurry too, but I like the general result a lot better than the previous image. Not 100% sold on the eyes, but don't look that bad either.

[![Cartoon of a man with a serious expression](https://dev-to-uploads.s3.amazonaws.com/i/o5nmjdwr3qnv8t23kgsu.png)](https://codepen.io/alvaromontoro/full/NWNvyQZ)

## Day 28: Plant sprouting

A vectorial cartoon of a pot with a plant sprouting inside. The soil has a little texture, and some filters were used to add some blurriness.

[![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ge2l94yyxn80aqm14t36.png)](https://codepen.io/alvaromontoro/full/jOqLoEp)

## Day 29: Magic castle

Another castle –the last one for a while, I promise–. This time it is based on [Disney World/Cinderella's Castle](https://dribbble.com/shots/2226079-Disney-World-Cinderella-Castle) by [Dmitry Stolz](https://dribbble.com/dmitrystolz) on Dribbble... and coding this one took more effort than what I expected initially.

[![Cartoon of a castle that resembles the one from Disneyworld, with many towers and balconies](https://dev-to-uploads.s3.amazonaws.com/i/ghzp46tpv7clql47vnwn.png)](https://codepen.io/alvaromontoro/full/BaKQzgG)

## Day 30: Leo Messi

Based on [Leo Messi](https://dribbble.com/shots/6457778-Leo-Messi/attachments) by [Mark Iddon](https://dribbble.com/mark-iddon) on Dribble. This illustration of Leo Messi celebrating a goal against Real Madrid was done only using clip-paths and backgrounds.

[![Polygonal cartoon depicting Leo Messi showing his jersey to a non-visible crowd](https://dev-to-uploads.s3.amazonaws.com/i/qakfl8zfwnsw1kzdkj9i.png)](https://codepen.io/alvaromontoro/full/MWyELyP)