Hello, linear-gradient!

In mathematics, a gradient is a function that shows the direction of the steepest increase of a certain quantity whose value can change from one point in space to another.

If you apply a gradient to a color, you will get a smooth transition from one color to another. Take the following, for example:

Gradients are specified inside the CSS property background-image. You can specify the simplest kind of gradient as follows:

background-image: linear-gradient(yellow, green);

The gradient itself is created using the function linear-gradient, whose parameters are used to specify the direction of the gradient and a set of colors. The direction may be omitted, in which case the default value (top to bottom) will be used. You can create a gradient utilizing as many colors as you wish.

Let’s practice by creating a simple two-color gradient for the .content block.