As some people might know, I’ve always loved 3D geometry. Which has meant getting drawn towards playing with CSS 3D transforms in order to create various geometric shapes. I’ve built a huge collection of such demos, which you can check …
I’ve always loved 3D geometry. I began playing with CSS 3D transforms as soon as I noticed support in CSS was getting decent. But while it felt natural to use transforms to create 2D shapes and move/rotate them in 3D …
I recently saw this loader on CodePen, a pure CSS 3D rotating set of bars with a fading reflection. It’s done by using an element for each bar, then duplicating each and every one of these elements to create the …
I recently saw a recreation of the Twitter heart animation among the picks on CodePen. If I happen to have a bit of time, I always look through the code of demos that catch my attention to see if there’s …
background-clip is one of those properties I’ve known about for years, but rarely used. Maybe just a couple of times as part of a solution to a Stack Overflow question. Until last year, when I started creating my huge collection …
It all started with this question Keith Clark recently asked on twitter.
CSS repeating-linear-gradients, do we need these? Can’t the same thing be achieved with a linear-gradient and background-size?
That’s a good question.…
The following is a guest post by Ana Tudor. If you’ve seen Ana’s work, perhaps you know that she uses mathematics and code together to make art. The finished pieces look like they take ages to make. But as …
I have recently found myself wanting to tightly pack an SVG shape into an HTML container. By tight packing, I mean I want the outermost points of my shape to be right on the edges on the container, without anything …
The following is a guest post by Ana Tudor. Ana always does a great job digging into the math behind what we can do graphically on the web. In this case, that’s extra-useful as there are several ways to …
The following is a guest post by Ana Tudor. Perhaps you know Ana from her amazing work combining code, math, and art. Here, she shows us how we can change the normal behavior of clipping paths by applying some …