Linear gradient generator

Create a gradient between two colors at a chosen angle.

▧New image
Opening your image…
—
Set the canvas size, endpoint colors and direction.

Create a linear gradient in three steps

  1. 1. Set up your image

    Choose dimensions, colors or content for the output.

  2. 2. Gradient settings

    Set the canvas size, endpoint colors and direction.

  3. 3. Download a copy

    Check the preview, then save a separate copy to your device.

Gradient settings

Set the canvas size, endpoint colors and direction.

Set the canvas size, endpoint colors and direction.

Questions, answered.

Is this an image or a CSS gradient?⌄

This tool exports a raster image. The settings define the generated pixels, not a CSS code snippet.

Are my images uploaded?⌄

No. Images are processed on your device. Your image files are never sent to a server.

Can I choose the output size?⌄

Yes. Set the pixel dimensions before downloading the generated image.