Divtober Day 3: Quick

alvaromontoro

Alvaro Montoro

Posted on October 4, 2021

Divtober Day 3: Quick

An animated version of Aesop's The Hare and the Tortoise drawn using CSS and a single HTML element for Divtober:

If it goes too quick (or is it fast?), here is a screenshot of the animation:

A tortoise on a skateboard with a rocket attached to its shell reaches the finish line (with the word Meta in Spanish) ahead of a sad/surprised hare


Something I learned from coding this one: Safari has some type of problem with the radial gradients when they have a value of 100%. It shows them squared. An easy hacky solution: use 99.9% instead of 100%.

💖 💪 🙅 🚩
alvaromontoro
Alvaro Montoro

Posted on October 4, 2021

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Divtober Day 31: Spooky
codepen Divtober Day 31: Spooky

November 1, 2021

Divtober Day 30: Contrast
codepen Divtober Day 30: Contrast

October 31, 2021

Divtober Day 29: Fruit
codepen Divtober Day 29: Fruit

October 30, 2021

Divtober Day 28: Dots
codepen Divtober Day 28: Dots

October 29, 2021

Divtober Day 27: Film
codepen Divtober Day 27: Film

October 27, 2021