Skip to content

Sharpen Image Online

Browser-side — no upload
Last verified May 2026 — runs in your browser

Sharpen Image Online — 3×3 Laplacian Kernel via Canvas ImageData per-pixel Convolution

Sharpen any image using a 3×3 Laplacian sharpening kernel `[0, -1, 0; -1, 5, -1; 0, -1, 0]` — the 4-connected second-derivative method per Gonzalez & Wintz Digital Image Processing (Addison-Wesley first edition 1977; Gonzalez & Woods 4th edition Pearson 2018 — 40-year anniversary; Wintz was the 1977 co-author, Woods replaced Wintz starting the 1992 second edition). The convolution runs per-pixel: for each interior pixel `(x, y)` in the image, the output channel value is `5 × centre - top - bottom - left - right` (diagonals weighted 0), producing a high-contrast response at edges where the centre pixel differs from its orthogonal neighbours; flat regions return zero response. The result is blended with the original via the 1-100% strength slider: `output = original + (sharpened - original) × strength/100`, where strength=100 applies pure Laplacian sharpen and strength=1 leaves the image nearly unchanged. The slider is debounced 100 ms via setTimeout to coalesce rapid drag events into a single re-render. Note — this is NOT unsharp-mask sharpening (which subtracts a Gaussian-blurred copy from the original — a more sophisticated edge-detection approach used in Photoshop / GIMP / Lightroom defaults). Laplacian sharpening is computationally cheaper (no separate blur pass) but is more sensitive to noise amplification at edges and corners. Output preserves source format: PNG → PNG (RGBA alpha preserved); JPG → JPG quality 0.92 (re-encoded via canvas.toBlob with Annex K quantisation per ITU-T T.81). Files never leave the device.

Related: Blur Image Image Filters Grayscale Image Sepia Image Brightness & Contrast Sharpen Image

How to sharpen an image

  1. Drop your image onto the tool or click to browse. Large photos work fine because the per-pixel convolution stays local.
  2. Drag the strength slider 1-100%. Start around 30-50% and nudge up until edges look crisp but not harsh — the slider is debounced 100 ms so the preview updates ~100 ms after you release the slider.
  3. The per-pixel Laplacian convolution runs `5 × centre - top - bottom - left - right` for each interior pixel; the slider blends the result with the original at the chosen strength.
  4. Compare the before/after preview to check that fine details look natural and grain is not amplified. For noise-heavy sources, keep strength below ~30% to avoid amplifying JPEG artefacts alongside real edges.
  5. Click Download to save the sharpened copy. The original stays on disk untouched — files never leave the device.

Common use cases

  • Rescue slightly out-of-focus phone photos before posting them to social media or printing for a photo book.
  • Make product shots look crisper on e-commerce listings where thumbnail rendering softens detail.
  • Bring back edge definition in screenshots that were rescaled or compressed for documentation, blog posts, or tutorial diagrams.
  • Compensate for the softening that JPEG compression introduces when saving at lower quality levels (the high-frequency detail lost to DCT quantisation is partially reconstructible via Laplacian edge boost).
  • Producing a pixel-precise sharpened reference image for further edge-based analysis (object detection, OCR pre-processing, feature matching).

Frequently asked questions

Is this Laplacian sharpening or unsharp-mask?

Laplacian. The algorithm applies a 3×3 Laplacian convolution kernel `[0, -1, 0; -1, 5, -1; 0, -1, 0]` directly to the source image — no separate Gaussian blur step. Unsharp-mask (USM) first blurs the source with a Gaussian filter, then subtracts the blurred copy from the original (USM = original + (original - blurred) × amount); USM is what Photoshop's 'Smart Sharpen', GIMP's 'Unsharp Mask', and Lightroom's 'Sharpening' panel all use. Laplacian sharpening is computationally cheaper (single convolution pass, no separate blur step) but more sensitive to noise amplification at edges. The 4-connected variant used here (centre weight +5) is the standard sharpening kernel published in Gonzalez & Wintz / Gonzalez & Woods Digital Image Processing (Addison-Wesley first edition 1977, 4th edition 2018).

Can sharpening fix a completely blurry photo?

No. Sharpening boosts edges that already exist in the source pixel data. If the subject was completely out of focus or moved during a long exposure, the high-frequency detail is genuinely missing from the file — there's nothing for the Laplacian convolution to amplify. For mild blur (slight motion blur, mild defocus), moderate strength (30-50%) often makes the result look acceptably sharp. For severe blur, the best you can do is accept the limitation and re-shoot — or use AI-based super-resolution tools (waifu2x, ESRGAN, NAFNet) that fabricate plausible detail via learned priors.

Will sharpening add noise to my image?

Yes, at high strength values. The Laplacian kernel amplifies any high-frequency component of the image — real edges AND noise grain AND JPEG block-boundary artefacts. Keep strength below ~30% for noise-heavy sources (high-ISO night photos, low-quality JPEG screenshots) and inspect flat regions like sky / skin / solid backgrounds — if speckling appears, reduce strength. For more noise-aware sharpening, use unsharp-mask variants in Photoshop / GIMP / Lightroom that include a separate threshold control.

Which format should I save the result as?

PNG for lossless archiving or further editing (the sharpened image stays bit-exact through the chain). JPG at quality 85-92 for web use — the JPEG re-encoding via canvas.toBlob applies ITU-T T.81 Annex K perceptual quantisation, which introduces a small additional loss (~1-2% perceptually invisible) but produces files 5-10× smaller than PNG for photographic content. The tool's automatic format preservation matches the source: PNG sources stay PNG; JPG sources output JPG at quality 0.92.

Is my image uploaded?

No. The decode + ctx.getImageData + nested-loop Laplacian convolution + strength blending + ctx.putImageData + canvas.toBlob chain all run client-side via WHATWG Canvas. DevTools Network tab shows zero upload requests during conversion.

3×3 Laplacian sharpening kernel + per-pixel Canvas convolution + strength blending

The sharpening algorithm applies a 3×3 Laplacian convolution kernel `[0, -1, 0; -1, 5, -1; 0, -1, 0]` to each interior pixel of the image, then blends the result with the original via the 1-100% strength slider. The Laplacian operator is a second-derivative method first standardised in image processing literature via Gonzalez & Wintz / Gonzalez & Woods Digital Image Processing (Addison-Wesley first edition 1977, the foundational textbook for digital image processing teaching for 40+ years, 4th edition 2018 celebrates the 40-year anniversary). The 4-connected Laplacian itself is `[0, -1, 0; -1, 4, -1; 0, -1, 0]` (sum to zero — pure edge detector); the sharpening variant used here has centre weight +5 (instead of +4), which is equivalent to `original + Laplacian = image + (4-connected edge response)`. Mathematically: at each interior pixel `(x, y)`, the output for each channel `c` is `5 × source[x,y,c] - source[x-1,y,c] - source[x+1,y,c] - source[x,y-1,c] - source[x,y+1,c]`. Edge regions (where the centre pixel differs from its 4 orthogonal neighbours) produce a high-contrast response that amplifies the difference; flat regions (where all 5 pixels are similar) produce near-zero response so the original survives almost unchanged. The strength slider blends: `output = original + (sharpened - original) × strength/100` — strength=0 leaves the image untouched, strength=100 applies pure Laplacian, intermediate values produce partial sharpening. The slider is debounced 100 ms via setTimeout to coalesce rapid drag events. Critical limitation — this is NOT unsharp-mask sharpening — unsharp-mask first applies a Gaussian blur to the source, then subtracts the blurred copy from the original (USM = original + (original - blurred) × amount), producing a more sophisticated edge response that's less noise-amplifying than direct Laplacian. Photoshop's 'Smart Sharpen', GIMP's 'Unsharp Mask', and Lightroom's 'Sharpening' panel all use USM variants. Laplacian sharpening is computationally cheaper (one convolution pass, no separate blur step) but is more sensitive to noise amplification at edges. For noise-heavy sources (high-ISO photos, JPEG-artefact-laden screenshots), keep strength below ~30% to avoid amplifying grain alongside real detail. Sharpening cannot recover information that's genuinely missing from the source — it can boost existing edge contrast but it can't restore detail that was never captured (e.g. completely out-of-focus photos, motion-blurred subjects).

  • 3×3 Laplacian sharpening kernel `[0, -1, 0; -1, 5, -1; 0, -1, 0]` (4-connected, second-derivative method per Gonzalez & Wintz / Gonzalez & Woods Digital Image Processing 1977)
  • Adjustable strength 1-100% via slider (debounced 100 ms via setTimeout to coalesce drag events)
  • Per-pixel Canvas ImageData convolution via WHATWG ctx.getImageData + Uint8ClampedArray nested-loop + ctx.putImageData
  • Strength blending: `output = original + (sharpened - original) × strength/100` — partial sharpening at intermediate values
  • NOT unsharp-mask (no Gaussian blur step — Laplacian is computationally cheaper but more noise-amplifying at edges)
  • Preserves source format: PNG → PNG with RGBA alpha; JPG → JPG quality 0.92 (ITU-T T.81 Annex K)
  • Browser-side via WHATWG Canvas ImageData + nested-loop convolution + canvas.toBlob — no upload
  • Operates in sRGB (IEC 61966-2-1:1999); source images without an embedded ICC profile are interpreted as sRGB

Free. No signup. No file uploads. Ads via AdSense (consent required).

Sources (9)
  • Gonzalez, R. C. & Wintz, P. A. (1977). Digital Image Processing (1st edition). Addison-Wesley 1977 (ISBN 0-201-02596-5) — the foundational textbook for digital image processing teaching; Paul A. Wintz was the original 1977 co-author with Rafael C. Gonzalez. Spatial filtering section covers the Laplacian operator and sharpening kernels: 4-connected Laplacian [0,-1,0;-1,4,-1;0,-1,0]; sharpening variant with centre +5 used as `image + Laplacian` for high-frequency edge boost. The 3×3 kernel [0,-1,0;-1,5,-1;0,-1,0] used by this tool is the canonical 4-connected sharpening kernel from this text.
  • Gonzalez, R. C. & Woods, R. E. (2018). Digital Image Processing (4th edition). Pearson Education 2018 (ISBN 978-0-13-335672-4) — the 40-year-anniversary 4th edition; Richard E. Woods replaced Paul A. Wintz as Gonzalez's co-author starting the 1992 second edition (also Addison-Wesley). Section 3.6 of the 4th edition covers spatial filtering including the canonical 3×3 Laplacian sharpening kernel used by this tool.
  • WHATWG (live). HTML Living Standard — Canvas 2D Context: getImageData(). html.spec.whatwg.org/#dom-context-2d-getimagedata — returns ImageData with Uint8ClampedArray of (R, G, B, A) bytes per pixel; the nested-loop Laplacian convolution iterates the array applying the 3×3 kernel to each interior pixel.
  • WHATWG (live). HTML Living Standard — Canvas 2D Context: putImageData(). html.spec.whatwg.org/#dom-context-2d-putimagedata — writes the convolved Uint8ClampedArray back to the canvas.
  • WHATWG (live). HTML Living Standard — HTMLImageElement (browser-native raster decoding). html.spec.whatwg.org/#htmlimageelement — universal browser entry point.
  • WHATWG (live). HTML Living Standard — HTMLCanvasElement.toBlob(). html.spec.whatwg.org/#dom-canvas-toblob — re-encodes canvas pixel buffer to Blob.
  • ITU-T (CCITT) Study Group VIII & ISO/IEC JTC 1/SC 29/WG 10 (JPEG) (1992). Information technology — Digital compression and coding of continuous-tone still images: Requirements and guidelines. ITU-T Recommendation T.81 (18 September 1992) / ISO/IEC 10918-1:1994 — JPEG baseline DCT bitstream; Annex K quantisation tables.
  • W3C (PNG Working Group) (2003). Portable Network Graphics (PNG) Specification (Second Edition). W3C Recommendation 10 November 2003 / ISO/IEC 15948:2004 — PNG output format for lossless archiving.
  • International Electrotechnical Commission (IEC) (1999). Multimedia systems and equipment — Colour measurement and management — Part 2-1: Default RGB colour space — sRGB. IEC 61966-2-1:1999 — default 8-bit RGB colour space the Canvas 2D path operates in.

These are the W3C, ISO/IEC, ITU-T, and IETF specifications the tool implements or builds on. Locate them on w3.org, iso.org, itu.int, or datatracker.ietf.org.

Sponsored

By ·