Image Edge Detection (Sobel / Scharr / Prewitt)
Image
Edge detection finds the places in an image where brightness changes sharply — the silhouette of an object against a background, the boundary between light and shadow, the rim of a building against the sky. Sobel, Scharr, and Prewitt are the three classic 3×3 separable convolution kernels that approximate the horizontal and vertical brightness gradient at each pixel. The gradient magnitude √(Gx² + Gy²) is then thresholded into binary edge / non-edge pixels. Sobel is the textbook choice with weights ±1 ±2 ±1; Prewitt uses uniform ±1 weights (less noise sensitive but less accurate at corners); Scharr uses ±3 ±10 ±3 (the most isotropic, best for sub-pixel work). All three run entirely client-side in your browser — your image never leaves the tab. Add 0–4 passes of box blur first to reduce noise on grainy photos, pick a threshold from 0–255, swap colors for a blueprint / sketch / neon look, and download the result as a PNG.
How to use
- Upload or drag-drop an image (any PNG / JPG / WebP up to 1200 px on the long side).
- Pick an operator — Sobel for general use, Scharr for cleanest contours, Prewitt for the simplest weights.
- Slide the threshold up to thin the edges, down to include subtler gradients.
- Add pre-blur passes if the image is grainy and producing too much noise.
- Swap the foreground / background colors or hit a preset (Classic white-on-black, Blueprint, Sketch, Neon) and download.
Frequently asked questions
- What's the difference between Sobel, Scharr, and Prewitt?
- All three approximate the image gradient using 3×3 kernels. Prewitt uses uniform ±1 weights — fastest, most noise-prone. Sobel adds ±2 in the central row/column — the classic compromise between accuracy and noise. Scharr uses ±3 / ±10 / ±3 — derived analytically for minimal angular error, so diagonal edges are more faithfully captured. For most photos, Sobel and Scharr look nearly identical; Prewitt is visibly noisier on textured backgrounds.
- Why pre-blur the image?
- Edge detectors are gradient amplifiers — they amplify both real edges and random pixel-to-pixel noise. A small blur (one or two passes of a 3×3 box filter) smooths the noise out without significantly softening real edges. This is the same idea behind the 'Canny edge detector', which is just a Gaussian blur + Sobel + non-max suppression. For clean photos you can leave blur at 0; for noisy scans or low-light photos try blur 2 or 3.
- Is my image uploaded anywhere?
- No. The image is read into the browser's canvas and processed locally by JavaScript on your device. Nothing is sent to a server. You can drop sensitive images here without worry; they live only in your tab until you close it.
- Can I detect color edges instead of brightness?
- Not in this version — the input is converted to grayscale luminance (0.299 R + 0.587 G + 0.114 B) first, then the gradient is computed on luminance. This is by far the most common approach because color edges that match luminance edges produce the same result, and pure color boundaries (e.g. pure red against pure green at the same brightness) are visually weak and not what edge detection is usually after.
Related tools
Image Crop (Aspect Ratio)
Crop any image to a standard aspect ratio (1:1, 16:9, 4:3, etc.) — centered automatically.
Image Rotate & Flip
Rotate an image 90° at a time or flip it horizontally / vertically, then download the result.
Image Resize
Resize an image to any dimensions and export as PNG, JPEG, or WebP — all in your browser.
Image to Base64
Convert an image to a Base64 data URL you can paste anywhere.
QR Code Generator
Create custom QR codes from any text or URL and download them.
Image Compressor
Compress and resize JPEG, PNG, and WebP images in your browser.