1 Element CSS Rainbow Gradient Infinity
I first got the idea to CSS something of the kind when I saw this gradient infinity logo by Infographic Paradise:
The original gradient infinity.
After four hours and some twenty minutes, of which over four hours were spent on tweaking positioning, edges and highlights... I finally had the result below:
My version of the rainbow gradient infinity.
The gradient doesn't look like in the original illustration, as I chose to generate the rainbow logically instead of using the Dev Tools picker or something like that, but other than that, I think I got pretty close—let's see how I did that!
Markup
As you've probably already guessed from the title, the HTML is just one element:
<div class='∞'></div>
Styling
Deciding on the approach
The first idea that migh...