Tasked with building a new reusable component I chose to code this component using pure CSS and no background images. When asking the designer what she had in mind for this it became quite clear they simply hadn't put much thought beyond what she saw in her canvas. It just needed to work. The bain of a front-end web dev's existence is to bring life to a designers flat and otherwise lifeless composition. This requires us to think about the end user and with WordPress this means multiple and different users all ranging from Admins, Editors, etc. prior to even giving thought to the web user.
This component is currently in use on the home page of: Acceleration Nation
Thanks to CSS gradients this turned out to be an easy lift. The hardest part of this element was making sure everything centered if the admin chose an arbitrary amount of elements. If 3 were used we'd have to make sure the element adapts to the full width of its container stacking the circles if need be.