Create a gradient background image for slides, websites, OGP thumbnails, phone wallpapers and more. Choose between linear (color changes smoothly along an angle you set) and radial (spreads out from the center). Pick a start and end color, and optionally add a middle color whose position (%) you can fine-tune with a slider. For linear gradients you can set the angle (0–360°) for horizontal, vertical or diagonal blends. Enter any width and height in pixels, or pick a preset for common sizes like 1920×1080 (FHD), 1200×630 (OGP), 1080×1920 (9:16) and 1080×1080 (square). A Swap colors button flips the start and end color in one click. Export as PNG or JPEG — ideal for turning a CSS gradient into an image, building a design base, or making backgrounds for thumbnails. Nothing is uploaded; the drawing and export run entirely on a canvas in your browser.
How to use
- Pick a type (linear or radial).
- Enter the width and height in pixels (or pick a preset).
- Choose a start and end color. For linear, set the angle and an optional middle color and its position.
- Use Swap colors to flip the start and end color in one click.
- Pick a format (PNG / JPEG) and click Download. Your image is never sent anywhere.
FAQ
Is the image uploaded to a server?
No. Drawing the gradient and exporting the PNG / JPEG run entirely in your browser using the Canvas API. The generated image is not uploaded, stored, or sent anywhere — everything is processed on your device.
Can I make a gradient with more than two colors?
It supports up to three colors: start, middle and end. Turn on "use middle color" to add a middle stop, then adjust its position (%) with the slider. This three-stop setup covers most practical multi-color gradients.
What does the angle change?
It sets the direction of a linear gradient. 0° goes left to right (horizontal), 90° goes top to bottom (vertical), and any value in between gives a diagonal. Radial gradients spread from the center, so there is no angle (the angle slider is hidden in that mode).
Can I export at OGP or phone-wallpaper sizes?
Yes. You can enter any width and height in pixels, and presets are provided for common sizes like 1920×1080 (FHD), 1200×630 (OGP), 1080×1920 (9:16) and 1080×1080 (square). You can go up to 4096px.