A browser-based AI portrait photo editor. All processing runs client-side with no uploads, no server and no subscription required.
Background Remove / Blur: MediaPipe selfie multiclass segmentation isolates the subject with sharp edges for transparent backgrounds or bokeh-style blur.
Skin Retouching: Bilateral-filter approximation smooths skin while preserving edges and texture.
Frequency Separation: Industry-standard technique that smooths skin tone and color while keeping pores and fine texture intact, applied only to detected skin areas.
Face Enhancement: Brighten faces, boost eye contrast, and whiten teeth using landmark-based masks.
Color Grading: Temperature, tint, shadows, midtones, and highlights controls all processed in a single Web Worker pass.
Dark Circle Removal: Brightens and desaturates the under-eye area using landmark-guided ellipse masks with radial falloff.
Wrinkle Smoothing: Frequency-separation smoothing applied to forehead and nasolabial zones detected via facial landmarks.
Blemish Healing: Click any spot to heal it. The tool finds the nearest clean-skin patch in the surrounding annulus and blends it in with Gaussian falloff. Fully undoable.
Vignette: Radial darkening composite applied post-processing.
Film Grain: Deterministic per-pixel noise (Park-Miller LCG) with adjustable strength and grain size.
Denoiser: Variance-based adaptive smoothing that flattens noisy flat areas while preserving edges.
Background Color / Gradient Fill: Replace the background with a solid color or a two-stop linear gradient at any angle, keeping the subject sharp.
Export Controls: Set JPEG quality and target output dimensions (with aspect-ratio lock) before downloading.
Manual Adjustments: Brightness, contrast, saturation, hue, and sharpness sliders.
Presets: Six built-in looks (Natural, Studio, Magazine, Soft Glow, B&W, Clean) plus the ability to save your own custom presets.
Auto-Enhance: One-click smart settings based on image luminance, skin ratio, and saturation analysis.
Before / After: Draggable split-view compare slider to see original vs edited side by side.
Batch Processing: Upload multiple images, apply settings, process all, and download as a ZIP.
Undo / Redo: Full settings history per image.
Privacy First: Everything runs in your browser. Images never leave your device.
- Next.js 16 (App Router + Turbopack)
- MediaPipe Tasks Vision for background segmentation
- face-api for face landmark detection
- TensorFlow.js for AI inference backend
- Zustand for state management
- Tailwind CSS v4 for styling
- Web Workers for off-main-thread pixel processing
- JSZip for batch export
git clone https://github.com/aayodejii/elsa.git
cd elsa
npm install
node scripts/downloadModels.js
npm run devOpen http://localhost:3000 and drop a portrait photo to start editing.
node scripts/downloadModels.jsdownloads face detection weights and the MediaPipe segmentation model intopublic/models/. This is a one-time step of about 3MB.
- Upload: Drop images onto the canvas. Each is stored as an
ImageBitmapthat is never mutated. - Edit: Adjust sliders in the sidebar. Settings changes are debounced and re-run the processing pipeline from the original bitmap.
- AI Pipeline: Background segmentation, face detection, and skin masks are cached per image. Only the first run loads models; subsequent slider changes reuse cached results.
- Export: Download the active image or batch-export all as a ZIP.
npm run build
npm startContributions are welcome. See CONTRIBUTING.md for guidelines.
AGPL-3.0