Cubular

to generate a new and unique variation

Source Code

Every variart piece is open source, you can see exactly how it is drawn from the code.

var color = '#036883';
var lightColor = '#bfdae3';

var xi = 0;
for (var y = -25; y <= height; y += 55){
  var xOffset;
  xOffset = (xi % 2 == 0) ? -60 : -30;

  for (var x = xOffset; x <= width; x += 60){
    var top = s.polygon(0, 20, 30, 0, 59, 19, 30, 36).attr({fill: 'white'})
    var bottom = s.polygon(0, 55, 58, 20, 59, 56, 30, 75).attr({fill: lightColor})
    var left = s.polygon(0, 20, 0, 55, 30, 36).attr({fill: color})
    
    var g = s.g(left, top, bottom);
        
    g.transform(Snap.format('t{x},{y}', {x: x, y: y}))
  }
  xi += 1;
}