Not in this v1. Copy the CSS to preserve the result.

Gradient Generator

Create linear, radial and conic gradients with copyable CSS.

Type

Angle135°

Color stops

Presets

Preview and CSS

linear

background: linear-gradient(135deg, #3DDC97 0%, #2563EB 100%);

CSS is generated locally in your browser.

Details below

About this tool

CSS gradients without a heavy editor.

The tool generates background declarations for linear-gradient, radial-gradient and conic-gradient. Stops can be tuned by color and position, and presets avoid copying brand names from the legacy app.

How to use

Choose type, tune stops, copy CSS.

Select linear, radial or conic.
Adjust angle, colors and stop positions.
Copy the CSS declaration ready to use.

FAQ

Frequently asked questions

Which gradient types are supported?

Linear, radial and conic, using modern CSS syntax.

Do presets copy known brands?

Can I use the CSS on any website?

Are gradients saved?

Design

Color Palette GeneratorColor palettes and harmonies with 8 algorithms.
Color ConverterHEX, RGB, HSL, HSV, CMYK, LAB and XYZ.
Color PickerPick colors and extract from images.

CSS gradients without a heavy editor.

Choose type, tune stops, copy CSS.

Frequently asked questions

Related tools

Privacy and ads