At Zillow, employees can earn badges on their profile for various accomplishments. Many of the badges look really nice, because they were created by our excellent design team. However, badges are pretty low priority, so often they don’t have time to create new ones, and many badges are designed by others without quite the same polish.

The inconsistency started to annoy me, so I decided to make this tool that would help anyone create a decent-looking (or at least consistent-looking) badge. Most of the badges follow a pretty standard template, so I distilled the controls down to only what varied between them.

The color picker users Vibrant.js to select a palette based on the image you upload, to make it even easier to match colors. The settings control an SVG image, which is downloaded as a PNG when the user is finished. They can then submit it to an admin to add to the system.