- read

10 Cool CodePen Demos (Divtober Edition)

Alvaro Montoro 44

Photo by Kari Shea on Unsplash

10 Cool CodePen Demos (Divtober Edition)

A collection of 10 cool CSS Art shared on CodePen during Divtober 2023

Alvaro Montoro
Level Up Coding
Published in
2 min read5 days ago

--

Divtober is a coding challenge that consists of creating daily CSS Art during the month of October. There is one catch: you can only use a single HTML element (preferably a <div>). The challenge is organized by Lynn Fisher, a pro at making this type of single-element drawing with CSS.

Dozens of developers have participated in this edition, and here I collected ten of my favorite Divtober demos (in no specific order):

Greg Robleto: Treat (Divtober #07)

A cute kawaii s’more. Complete with nice shadows, which tend to be one of the most difficult things to code in these drawings… at least for me!

Lynn Fisher: Fall (Divtober #01)

Every divtober drawing that Lynn does is amazing in its own way. These abstract leaves and colors represent the fall season perfectly.

Carter Lovelace: Bones (Divtober #11)

An animated spooky skull. Quite appropriate for the challenge and the month it is in.

Temani Afif: Sparkle (Divtober #10)

This demo has two great things in one: the star shape (and its border) and the sparkling effect of the star. And all with a single HTML element!