Drawing with CSS
From time to time I run across somebody that has pushed CSS to the point where they can draw pictures with only markup. There are a few interesting older CSS behaviors that make this possible, and of course some new tricks such as gradients as well. In being inspired by some of these examples, I couldn’t help but try my hand at the technique on an image I see nearly every day – the Adobe logo. Since the Adobe logo does not have any gradients, and is fairly blocky to begin with, it made for an easy subject for a first attempt. I was able to manipulate the border width and thickness, as well as width and height, to draw the triangles that make up the logo. It may, however, surprise you to find that I have also drawn the letters of the logo with only...
I am a father, husband, photography enthusiast and pilot most of the time. I work for Adobe managing the world's best evangelism team the rest of the time. I also enjoy hacking hardware, cigars, travel, and movies.