Initializing

Blur faces
automatically.

Upload any image β€” FaceShield detects every face using AI and applies a privacy blur exactly to the face shape. All processing happens locally in your browser.

πŸ“·

Drop an image here

or click to browse your files

45px
image.jpg
0 faces
β–Έ Console Output

Setup Instructions

01
Download face-api.js model files
Get both the ssd_mobilenetv1 and face_landmark_68 model weights from the official repository: face-api.js weights on GitHub.
02
Place models in a /models folder
Create a folder named models in the same directory as this HTML file and copy all downloaded weight files into it. Both ssd_mobilenetv1_model-* and face_landmark_68_model-* files are required.
03
Serve via a local web server
Browsers block file:// requests. Use: npx serve ., python3 -m http.server, or VS Code Live Server. Then open http://localhost:PORT/face-blur.html.
04
CDN fallback (no local setup needed)
If no local /models folder is found, the app automatically fetches both models from https://cdn.jsdelivr.net/npm/@vladmandic/face-api/model/. Just serve this file and it works out of the box.
05
Tuning constants
Edit at the top of the <script>: BLUR_RADIUS (default 22) controls blur strength; MIN_CONFIDENCE (default 0.4) controls detection sensitivity; FEATHER_RADIUS (default 24) controls how soft the blur edges fade into the original image.