Written on August 8, 2013
I'm writing a book about building and deploying web applications with Haskell and Yesod. Want to know when it's released? Click here.
I borrowed the idea from a design that I came across on simpledesktops.com, by this cool hacker guy Adam Bachman. It consists of a number of different coloured arcs of varying lengths. I decided to try and bring it to life with some animation.
Each arc is just a list-item in an unordered list. The part of the element you’re seeing is the border. I curved the borders with
border-radius, and then just removed a few sides of the borders by making their colour transparent. The animation is just random degrees of rotation in keyframes, with an infinite transition time.