To add a color gradient to a block-level element, apply the following linear-gradient function to the element background:

linear-gradient(direction, color-stop1, color-stop2, ...)

where direction sets the direction of the gradient expressed either as angle or the corner/side to which the gradient is pointing, color-stop1, color-stop2, ... are the colors in the gradient along with the locations (stops) where those colors are placed.

Use the web form below to generate the code for the linear-gradient function. Use the [+] button to add more color stops. Use the [-] button to remove color stops.