A curated collection of inspirational AI-powered JavaScript apps


Built by Elle, Asim, Osama - hosted on Azure

Face Doodle

Doodle face masks right from the browser with TensorFlow.js and FaceMesh


  • TensorFlow.js
  • FaceMesh
  • Three.js

Doodle Face is a way to draw your own AR masks right in the browser with TensorFlowJS. It uses a pretrained model called FaceMesh which returns coordinates for 468 3D facial landmarks.

This demo uses Three.js and aligns a 3D mesh with the 468 points to get smooth surface normals. A new plane is added for each new line and tracks the closest face normal.

Try it out now here