A web AR studio: live face tracking in the browser, 3D glasses, masks and face paints, and an AI pipeline that turns one photo into a wearable 3D model.
Brands want fans and shoppers to try things on their faces, but nobody downloads an AR app for one filter, and every new filter normally needs a 3D artist.
The story
01
Open the camera
Facet runs in the browser. Point a webcam or phone at a face; there's nothing to install.
02
Track 468 points
Every frame, the face becomes a 468-point mesh that follows each turn, blink and smile.
03
Pick an anchor
Each filter attaches to a landmark. Glasses use the bridge of the nose, point 168.
04
Try on 3D
Glasses, masks and hats snap to their anchor and move with the head. Twelve glasses in the library.
05
Paint the face
Face paints and makeup wrap the tracked mesh, so they bend with expressions. Fourteen to choose from.
06
Photo to 3D
Upload one image and an AI model returns a .glb. No 3D artist, no modelling software.
07
Place it, save it
Set position, rotation and scale, and the new filter is saved to your personal library.
What we built
The work that made it.
Face tracking in the browser
A 468-point face mesh is tracked from the webcam in real time, with nothing to install on any desktop or phone.
Accessories that stay put
3D models anchor to landmarks like the bridge of the nose, so glasses and masks follow every turn of the head.
Face paint on a live mesh
Paint, makeup and mask textures wrap the tracked face mesh, so they bend with expressions instead of floating on top.
Photo to 3D
Upload one image and an AI model generates a .glb you can preview and turn into a filter, no 3D artist needed.
Make it yours
Position, rotation, scale and anchor are saved per filter and per user, so a custom filter comes back exactly as placed.
Accounts and a personal library
Sign-up with email verification, unique usernames and a filter library stored per user.
How it works
Step by step.
01
Track
The webcam feed becomes a 468-point face mesh, every frame.
02
Anchor
Each filter attaches to a landmark, such as the nose bridge.
03
Render
3D models and face textures are drawn over the face in real time.
04
Create
A photo becomes a 3D model, placed and saved as a new filter.
Webcam→Face mesh→Anchor→3D filter→Your face
Custom filters take a second path: photo → AI image-to-3D model → .glb → placement → saved to your library.
Built with
Next.js · MindAR · Three.js · React Three Fiber · MongoDB · NextAuth · image-to-3D AI model
Building an AR experience?
We can build this for you. Tell us what you're working on.