Create linear, radial and conic CSS gradients with multiple color stops. Copy the code in one click.
The linear gradient (`linear-gradient`) is the most used in CSS. It creates a smooth transition between two or more colors along a directional axis. Adjust the angle between 0° (vertical) and 360° to orient the color flow. Ideal for backgrounds, CTA buttons, banners and headers. Combine 3 or more colors for sophisticated multi-layer effects. The generated code is directly compatible with all modern browsers without any vendor prefix.
The radial gradient (`radial-gradient`) radiates from a central point, perfect for light effects and colored circles. The conic gradient (`conic-gradient`) rotates around a center according to an angle — ideal for creating pie charts, color wheels or aurora effects. Both types support multiple color stops for complex transitions. Export the CSS code in one click and paste it directly into your stylesheet or framework.