trianglefy test

by PhilQ

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/trianglify/0.4.0/trianglify.min.js"></script>
hoi

CSS

*, *:before, *:after {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	width: 100%;
	display: inline-block;
}

svg {
	width: 100%;
	height: auto;
}

JavaScript

var colorFunc = function(x, y) {
	return 'hsl('+Math.floor(Math.abs(x*y)*360)+',80%,60%)';
};

var pattern = Trianglify({
	width: 2100,
	height: 1485,
	cell_size: 120,
	variance: 0.8,
	x_colors: [
		'#823572',
		'#EC7009',
		'#823572',
	],
	/*
	x_colors: [
		'#823572',
		'#823572',
		'#1C86B5',
		'#7CB247',
		'#CBDB20',
		'#FFA514',
		'#EC7009',
		'#CC1E82',
		'#CC1E82',
	],
	y_colors: ['#00000000', '#ffffffff'],
	*/
});
document.body.appendChild(pattern.svg())