algorithmically generated triangle art

generate star follow

Getting Started

You can grab a copy of Trianglify from npm, bower, or cdnjs

var pattern = Trianglify({
  height: 300,
  width: 300,
  cell_size: 40});


Not a coder? You can use the Trianglify Generator example to tweak parameters and generate images for your designs.


Specify the amount of randomness used when generating the pattern

Cell Size

Specify the granularity of the pattern


Trianglify comes bundled with the colorbrewer palette set

The above examples are just a subset of the available color gradients that Trianglify supports out of the box. See this page for a full list of the scales included with colorbrewer.

Output Formats

Canvas, SVG, and PNG built in

var pattern = Trianglify();

//SVG DOM node

//Canvas DOM node

//Render to existing canvas

//PNG data URI string

It's possible to write your own rendering implementations using the geometry in pattern.polys, which contains an array of each polygon's vertices and color.

More Options

var defaults = {
  cell_size: 75,
  variance: 0.75,
  x_colors: 'random',
  y_colors: 'match_x',
  palette: Trianglify.colorbrewer,
  color_space: 'lab',
  color_function: false,
  stroke_width: 1.51,
  width: 600,
  height: 400,
  seed: null

For more information on what the above options do and what values they accept check out the README on GitHub.

Trianglify was written by Quinn Rohlf. Check it out on GitHub!