Color Grid

Color Grid is a JavaScript library that creates a colorful moving mosaic background image.

This library was originally created to be a statement background image that was dynamic for the homepage of Watersheets, an Iota Dynamics product. The Watersheets logo already looked like a mosaic, which was the reason why this project was created, and I was commissioned to do it. I color-picked the colors from the logo, and had them be the colors inputted into the Color Grid for the homepage.

The customizability of the coverage percentage and color change speed allowed for the background image to be tweaked to match the needs of many different sites because some people would want 100% grid coverage, but in Iota’s case, they wanted it to be relatively sparsely populated. The CEO of Iota figured out that multiple color grids can even be set to the same div for an even richer experience, something that I did not even anticipate or develop for.