Delaunay triangulation maximizes the inner angles of a triangle. This is an animated image from Wikipedia’s article.


Delaunay tessellation is based on a set of points. As the points’ positions change, the resulting image will also change. How do we place these points?Here are 4 studies of Chairman Mao, the destroyer of all the good things in China. From left to right:

  1. Points that are randomly placed
  2. Points sampled using best candidate algorithm
  3. Feature points detection on the original image using JSFeat library
  4. Manually moving the points.


By mapping the points’ positions to original image’s pixels, we can extract the colors and apply them to paint our triangles. For example, you can take the color from a triangle’s incenter, or an average color from the 3 points of a triangle, or a gradient with multiple stops based on the interpolated points of a bisector line.


More triangles furnish an image with extra details, though make it more apathetic also. Gradients add ornaments and softness to the image, while solid colors feel more direct and confident. Adding auxiliary graphic elements, such as circles and borders, flattens the image and renders it graphical.



Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store