Real-Time Facial Expression Recognition

Using Face API.js in the Browser

Loading models, please wait...

Controls

Bonus: Fine-Tuning Exploration

This advanced feature allows you to fine-tune the Face API emotion detection model to recognize your personal expressions better. Collect samples of your face showing different emotions, and the system will adjust the model's internal weights to specialize in your specific way of expressing emotions.

Samples collected: 0. Ready to fine-tune.

User Guide

  1. Allow Webcam Access: Your browser will ask for permission to use your webcam. Please allow it.
  2. Start Webcam: Click the "Start Webcam" button to begin the video feed.
  3. Emotion Detection: The app will automatically detect your face and classify your expression. The dominant emotion and a confidence score will be overlaid on your face.
  4. Controls:
    • Use the Start/Stop Webcam button to manage the video feed.
    • Toggle Confidence to show or hide the percentage score.
    • Enable Sonification to hear a sound that changes pitch based on the detected emotion (just for fun!).
  5. Responsiveness: The video and overlay will resize to fit your screen.
The detected age and emotion will appear on the overlay. Keep your face steady for better accuracy.

Fine-Tune Face API Emotion Detection: Adapt Recognition to Your Face

This feature lets you personalize the Face API emotion detection model to recognize your specific way of expressing emotions. It does NOT modify age detection—only emotion classification. When you click "Capture Sample," the system records a 112×112 crop of your detected face along with the emotion label you selected. After collecting at least ten samples across different emotions, clicking "Fine-Tune Model" loads the original Face API emotion detection model (with its pre-trained weights from the local model files), then trains it on your personal face samples using a low learning rate. This fine-tuning adjusts the model's internal weights to specialize in recognizing emotions in your face while preserving the general knowledge it already has.

Once fine-tuning completes, the system exports all the updated model weights as a JSON file that you can download. This JSON contains every weight in the Face API emotion network—all its layers and parameters—now specialized to your face. You own this file completely and can store it offline forever. With sufficient training samples (20–50 per emotion is ideal) and a modern browser, you'll have a personalized emotion recognizer that understands how you specifically express each emotion.

Everything happens entirely in your browser. Your face images and fine-tuned model weights never leave your device, and no backend server is involved at any step.