Create beautiful CSS gradients for your web projects. Customize colors, directions, and more.
CSS gradients let you display smooth transitions between two or more specified colors. There are three types of gradients:
Linear gradients transition colors in a straight line. You can control the direction or angle of the transition.
background: linear-gradient(direction, color1, color2, ...);
Radial gradients transition colors from a central point outward in a circular or elliptical shape.
background: radial-gradient(shape size at position, color1, color2, ...);
Conic gradients transition colors around a center point (rather than radiating from it).
background: conic-gradient(from angle at position, color1, color2, ...);