Gradient transparency maker.

A gradient over the alpha channel: the image goes from fully visible on one side to a chosen opacity on the other, with a straight ramp between. Colors stay as they are; only how much of each pixel shows changes. It is how an image is blended into a page or another picture.

Linear fades along a straight line, left to right, right to left, top to bottom or bottom to top. Radial fades in a circle from the center: Edges fade keeps the middle and loses the corners, a vignette; Center fades is the reverse, a spotlight. Linear suits edges and banners, radial suits focus and masks.

Set the opacity to a value above 0. At 30, the far side of the fade stays 30% visible instead of disappearing, which blends an image into a background without a hard end. At 0 it fades all the way out.

Process the image once, download it and drop the result back in with another mode or direction. Each pass multiplies the alpha that is already there, so a horizontal and a vertical fade combine into a fade on both axes.

The new opacity multiplies the alpha that is already there. A pixel at 50% alpha, with 50% applied, ends at 25%; a fully transparent pixel stays fully transparent. So a logo on a transparent background keeps its background, and only the logo itself fades.

Set the opacity to 0 and pick Linear. The image is fully visible at the start side and fully transparent at the far side, with a straight gradient between. For a partial fade, set the opacity to 30 or 50 instead: the far side then stays faintly visible.

Radius is where the radial fade begins, as a share of the distance from the center to a corner. At 0 the tool uses half that distance. A small radius fades most of the image and leaves a tight center; a large one touches only the corners.

The result is drawn on a checkerboard, the usual way to show transparency, so faded areas show the squares through. To judge it over real content, download the PNG and place it on your page or in your design tool.

No. Your browser decodes the file and does the pixel work with its Canvas API, and the page makes no request with it. You can load the page, go offline and keep working; the download is written from memory on your device.

No. The Gradient transparency maker is free and opens without a sign-in, an account or an install.

Nothing. The Gradient transparency maker holds your input in the page's memory, so closing or reloading the tab clears it, and it saves nothing in this browser.

Up to 100 MB per file, the limit the tool states under its drop area. A larger file is refused with a plain message instead of being decoded.

No, it takes one file at a time. If you drop or choose several, only the first is used; run the tool again for the next one.

The edit is written as a PNG because PNG stores every pixel exactly, with a full alpha channel, so the result can be edited again without a second round of loss.

No. The browser decodes the image and the tool writes a new file from its pixels, so camera EXIF, GPS position and text chunks in the original are not copied into the result. Keep the original file if you need them.

No. The result has the same width and height in pixels as the source.

Closest to the Gradient transparency maker: PNG opacity changer, Image fade effect generator, Vignette fade effect, Semi-transparent PNG creator. Each opens on its own page, free and in the browser.

The Gradient transparency maker is one of 47 in its group. The group's page, /tools/png, lists them all.

The tool is free. Its interface is built from shadcn.io's own components (Button, Input, Slider and the rest of the registry under /ui), which come in React, Vue, Svelte and Solid. Pro adds the blocks and templates for the product around it.