Jezen Thomas

Jezen Thomas

CTO & Co-Founder at Supercede. Occasionally I write about technology.
Working from anywhere while continuously travelling the world.

Subscribe to the newsletter

Powered by Buttondown.


I borrowed the idea from a design that I came across on, 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.

See the Pen Arcify by Jezen Thomas (@jezen) on CodePen.