As covered my projects page, I here is a little code for a randomly generated inkblot test built in a grid with triangles. Secondary Inspiration is drawing mirrored triangles in graph paper.

Really there are only 2 parts, the CSS and the Javascript. We need a single element for everything to fit inside of. So first off we will build a little basic CSS.
.row{             /*basic rows*/
    float:left;
    clear:left;
}

.box {          /*columns in row to form a grid*/
    float:left;
    width:20px;
    height:20px;
    /*border:1px solid;*/
}

.t1, .t1n {    /*creates a box*/
    width:20px;
    height:20px;
    background-color:black;
}
.t2, .t4n{     /*Top Left Triangle*/
    width:0px;
    height:0xpx;
    border-top: 20px solid black;
    border-right: 20px solid transparent;
}
.t2n, .t4 {    /*Top Right Triangle*/
    width:0px;
    height:0xpx;
    border-top: 20px solid black;
    border-left: 20px solid transparent;
}
.t3, .t5n{     /*Bottom Left Triangle*/
    width:0px;
    height:0xpx;
    border-bottom: 20px solid black;
    border-right: 20px solid transparent;
}
.t3n, .t5{     /*Bottom Right Triangle*/
    width:0px;
    height:0xpx;
    border-bottom: 20px solid black;
    border-left: 20px solid transparent;
}
Next we need a little bit of javascript to build the table then to render the ink. But first be sure to include the JQuery library.
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
Javascript:
//Build Grid
var rows = 20; //set number of rows
var columns = 20; //set number of columns
function build(){
	for (var r=0; r < rows; r++){
	    var newdiv = "<div class='row' id=row_"+r+"></div>";  //create new row
	    $('#blotspace').append(newdiv);
	    for (var c= -(columns/2); c < (columns/2)+1;c++){
		if (c != 0){
			//create new box, ranging from negative to positive skipping 0
			$('#row_'+r).append("<div class='box' id=box_"+r+"."+c+"></div>"); 
		}
	    }
	}
}
//draw inkblots
function draw(){
	$('.ink').remove();
	for (var r = 0; r<rows; r++){
		for (var c = 1; c < (columns/2)+1;c++){
			var n = Math.floor(Math.random() * 6) //randomly generate number between 0 and 5 which will reference css
			document.getElementById('box_'+r+'.'+c).innerHTML = "<div class='ink t"+n+"'></div>";
			document.getElementById('box_'+r+'.-'+c).innerHTML = "<div class='ink t"+n+"n'></div>";
		}
	}
}
$(document).ready(function(){
	build();
	draw();
	var repeat = setInterval(draw,1000); // redraw ever second
})

Lastly add a <div id=blotspace></div> for the jquery to insert all the code into.