Skip to content

Face Detector

Face detection requires Chrome with Experimental Web Platform features enabled at chrome://flags/#enable-experimental-web-platform-features. Camera preview and capture work without it.

Camera frames stay on this device.

How it works

After confirming native support, the demo passes the live <video> element to Chrome's FaceDetector. Each result includes a bounding box, which is drawn on the preview overlay.

const detector = new FaceDetector({
	fastMode: true,
	maxDetectedFaces: 5,
});

const faces = await detector.detect(video);

for (const { boundingBox } of faces) {
	const { x, y, width, height } = boundingBox;
	overlayContext.strokeRect(x, y, width, height);
}

Preview

Waiting for camera access

Requesting camera access… Checking Chrome face detection support…