Blur image

Blur image applies one blur setting to the whole picture. That makes it useful for soft backgrounds, draft mockups, and images that need less visual detail behind a title. It does not let you paint over one face or select a private region. If one small area must be hidden, crop it away or use an editor with a selection mask. Whole-image blur can reduce the readability of incidental details, but it should not be treated as guaranteed redaction. A determined viewer may still infer shapes, colors, or layout from a blurred copy.

Start by deciding what the output must communicate. A background for white text usually needs enough blur to suppress edges while retaining the image's broad color pattern. A mood board may need only a slight softening. Privacy work needs a different standard because the question is not whether the image looks softer, but whether the sensitive detail is irrecoverable. For confidential material, remove the detail from the source or cover it with an opaque edit in software built for redaction. Use this tool for visual treatment, not as proof that information has been destroyed.

After you choose a file, the browser decodes it and reports its natural pixel dimensions. PWRKIT creates a local preview with a temporary object URL. Processing starts only when you press the Blur image button. The workbench creates a canvas at the source width and height, applies the browser canvas blur filter, draws the decoded image, and asks the browser to create a new image blob. The selected file and the generated blob stay in the page while you work. They are not sent to a PWRKIT processing server.

Browser decoding determines which inputs work. The picker accepts image files and names JPEG, PNG, and WebP as the expected formats, but another image type may open if the current browser can decode it. A file with an image extension can still fail when its bytes are damaged or its codec is unsupported. The workbench rejects files larger than 30 MB before decoding. Very large pixel dimensions can also exceed a browser's canvas memory or maximum canvas size even when the compressed file is no larger than 30 MB.

The Blur strength control runs from 0 to 40 pixels and starts at 8 pixels. A value near zero preserves most edges. Higher values spread neighboring pixels across a wider area, so outlines merge and fine texture disappears. The same numerical value looks different on images with different dimensions. Eight pixels is noticeable on a 600-pixel thumbnail but relatively subtle on a 6000-pixel photograph. Judge the rendered preview at the size where the image will be used instead of assuming one setting works for every source.

Move the slider in deliberate steps. For a page header, try a modest value, process the image, then place actual headline text over the downloaded copy in the intended layout. Increase the blur only if the background still competes with the text. For an abstract color wash, a stronger setting may suit the composition. The control does not add a dark overlay, change saturation, or improve text contrast by itself. Those are separate edits. If legibility is the goal, verify contrast after the blur rather than relying on softness alone.

Canvas blur samples pixels around each point, including pixels close to the image boundary. Depending on the browser, a strong blur can make the outer edge look faint or introduce a transparent-looking fringe when the source supports alpha. Inspect all four sides of the processed preview. If the image will sit flush against a colored container, edge changes may be more visible than they were against the checkerboard or neutral preview. Cropping a few pixels after blur can remove an unwanted rim, though that also changes the final dimensions.

The tool keeps PNG input as PNG and WebP input as WebP. Other decoded inputs are exported as JPEG. That distinction matters. PNG can retain transparent areas, while JPEG has no alpha channel. A source type outside the three named formats may therefore download as JPG after processing. The browser chooses the encoder implementation, and the shared workbench passes its current quality value when creating the blob. Blur image has no visible quality slider, so use the preview and reported file size as practical checks rather than expecting control over every encoder parameter.

Suppose a 2400 by 1350 photograph will become a website hero behind a short heading. Upload the source and confirm that the workbench reports 2400 by 1350. Begin with the default 8-pixel blur and process it. Read the output size, download the copy, and place it in the real hero component at its production crop. A preview shown in full may look soft enough while the center crop still contains a sharp high-contrast object. Testing the actual placement exposes that problem before publication.

If the heading remains difficult to read, return to the source in the workbench and raise the blur a few pixels. Do not repeatedly process a previously blurred download unless you intend to compound the effect and accept another encode. Starting from the original gives you a stable comparison for each attempt. Once the edge detail is quiet, check whether the colors still support the page design and whether the file dimensions match the layout. Blur changes detail, not geometry, so resize or crop in the appropriate tool if the hero needs a different aspect ratio.

The preview switches from the source image to the generated output after processing. Look at faces, text, logos, high-contrast borders, and the image perimeter. Zooming the browser can help reveal surviving detail, but it is also useful to open the downloaded file in a separate viewer at 100 percent. Confirm that the dimensions remain unchanged, the format suits the destination, and the output opens without an error. The status message reports output size as a percentage of the original file size, which is a size comparison rather than a quality score.

Keep the source file until the processed image has passed its destination checks. A content management system may create additional sizes or recompress the upload, and that can change how the blur looks. Social platforms may crop around the center. Presentation software may scale the picture beyond its native dimensions. Test the final published or exported context whenever the image matters. If the output is unexpectedly larger, remember that blur alters pixel patterns and the browser re-encodes the image; smaller detail does not guarantee a smaller compressed file.

A rejected file should first be checked against the 30 MB limit and opened directly in the same browser. Changing an unsupported file's extension to JPG cannot change its encoding. Export a new copy from a trusted image application, then select that copy. If processing reports that canvas work is unavailable, reload in a current browser with scripting enabled. A huge panorama may fail because decoded pixels consume much more memory than the compressed file on disk. Resize the source to its required delivery dimensions before applying blur.

If the result looks unchanged, make sure the strength is above zero and compare a detailed edge rather than a flat area. If it is too soft, select a lower value and process the original again. If a transparent PNG develops an undesirable fringe, inspect it against the destination background and consider cropping the outer pixels. Reset clears the selected file, preview, output, dimensions, and errors from the workbench. Download before resetting if you want to keep the current result, because the temporary output URL is released when the page is cleared.

Blur image preserves the source dimensions and changes the appearance of the entire frame. Resize image changes pixel dimensions, while Crop image removes pixels outside a rectangle. Compress image targets file size with a quality control. Convert to JPG, PNG, or WebP chooses a destination format. Those operations answer different problems. A blurred 5000-pixel photograph is still 5000 pixels wide, and a smaller file is not guaranteed. If page speed is the goal, set the required dimensions first and then use compression or a suitable web format.

Remove image metadata re-encodes a source to discard embedded metadata, but blur itself should not be assumed to describe or verify metadata removal. Color picker samples the visible RGB value at a point and does not modify the file. A common workflow for a web banner is crop for composition, resize to delivery dimensions, blur the result, then inspect the final format and file size. Keep a clean original outside that chain. Each canvas pass creates a new copy, so limiting unnecessary re-encoding helps avoid cumulative changes.

Source selection matters as much as the slider. Blurring a small thumbnail and later enlarging it can expose coarse transitions, while blurring an oversized source spends memory on pixels that may never be delivered. Prepare the intended crop and dimensions before the final blur when those decisions are already known. If several layouts need different crops, make each blurred derivative from the appropriate clean crop rather than stretching one output across every slot.

For accessibility, do not use blur as the only way to separate foreground text from a busy image. Text still needs sufficient color contrast in the rendered component, and important information should not exist only inside a decorative picture. Check the page at narrow and wide breakpoints because responsive positioning can move the heading over a different part of the background.