A Self Organizing Map Clustering of block Colors

All of the custom colors found in d3.js blocks were used as input. The data was taken from the enjalot's block and includes 3250 different blocks. He parsed out hex codes, hsl(a) and rgb(a) in any html, js or coffee file found in each block and I converted all of these to their hex, rgb and hsl values. There were 24700 different color statements in these blocks that make up 4350 unique colors.

The clustering grouped similar colors together in 600 hexagons (based on their RGB and HSL values, thus 6 variables in total). The map below displays the "average" hex value and the size of each hexagon is scaled to the number of (the 24700) colors that are grouped in each hexagon. The biggest one, pure black, #000000, has 1500 entries. In essence it is an exercise in trying to map a 3D color space into a 2D plane while also looking at the nuances in colors used in blocks :)