Gradient Wallpaper Generator

What it makes

Choose two colors and a direction — left to right, top to bottom or corner to corner — and Save wallpaper makes a PNG that starts at the first color on one side and blends evenly into the second on the other. The preview above has the image's own shape and is drawn by the same code as the file.

Sizes run from 16 × 16 to 7680 × 4320, with common monitor and phone sizes one press away and This screen filling in the size your browser reports.

Why a gradient can show faint bands

Each color in an image is made of three channels, red, green and blue, and each channel has 256 steps. When the two colors are close, there are fewer steps between them than there are pixels across a wide screen, so each step covers a strip of pixels — and on some screens those strips show as faint bands.

This page does not hide that by sprinkling in noise, a technique called dithering, because that would change the colors in the file. The file holds the exact blend; if bands bother you, choose two colors further apart. To see how your own screen handles fine steps, there is the Color Banding Test.

Made on your device

The image is drawn by your browser and saved straight from it: nothing is uploaded, and ScreenTail keeps no copy. Before it is saved, the page reads it back to confirm its size; if your browser cannot make the size you asked for, the page says so instead of handing you a broken file. The file name records both colors and the size, so you can make the same one again.

For a gradient to use in a web page instead of an image, the Gradient Generator gives you the CSS. Setting the file as your wallpaper is done in your device's own settings.