Please bookmark this page to avoid losing your image tool!

Soft Focus Blur Image Effect Generator

(Free & Supports Bulk Upload)

The result will appear here...

JavaScript Code (For Advanced Users)

You can edit the below JavaScript code to customize the image tool.

function processImage(originalImg, blurRadius = "15", opacity = "0.5", blendMode = "screen") {
    // Parse and sanitize parameters
    const blur = isNaN(Number(blurRadius)) ? 15 : Math.max(0, Number(blurRadius));
    const alphaNum = Number(opacity);
    const alpha = isNaN(alphaNum) ? 0.5 : Math.max(0, Math.min(1, alphaNum));
    
    const validBlendModes = [
        'source-over', 'multiply', 'screen', 'overlay', 'darken', 'lighten',
        'color-dodge', 'color-burn', 'hard-light', 'soft-light',
        'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity'
    ];
    
    // Standardize default standard blend mode 'normal' to 'source-over'
    let compositeOp = String(blendMode).toLowerCase().trim();
    if (compositeOp === 'normal') compositeOp = 'source-over';
    if (!validBlendModes.includes(compositeOp)) compositeOp = 'screen';

    // Set up canvas
    const canvas = document.createElement('canvas');
    const width = originalImg.width;
    const height = originalImg.height;
    canvas.width = width;
    canvas.height = height;
    
    const ctx = canvas.getContext('2d');

    // 1. Draw the sharp original image as the base layer
    ctx.drawImage(originalImg, 0, 0, width, height);

    // 2. Set the properties for the soft focus blur overlay
    ctx.globalCompositeOperation = compositeOp;
    ctx.globalAlpha = alpha;
    ctx.filter = `blur(${blur}px)`;

    // 3. Draw the original image again; it will be blurred and blended over the base
    // The combination of screen blending + blur gives the classic "dreamy" soft focus glow.
    ctx.drawImage(originalImg, 0, 0, width, height);

    // Reset properties to avoid any unintentional side effects mapping if reused
    ctx.filter = 'none';
    ctx.globalCompositeOperation = 'source-over';
    ctx.globalAlpha = 1.0;

    return canvas;
}

Free Image Tool Creator

Can't find the image tool you're looking for?
Create one based on your own needs now!

Create a custom image tool

Description

The Soft Focus Blur Image Effect Generator allows users to apply a dreamy, glowing aesthetic to their photos by overlaying a blurred version of the image onto itself. Users can customize the effect by adjusting the blur radius, controlling the opacity of the glow, and selecting from various blend modes to achieve different visual styles. This tool is ideal for photographers and digital artists looking to create romantic, ethereal, or professional-looking portraits and atmospheric landscapes.