CSS Linear GradientsWhat is a Linear Gradient?
Probably the most common and used type of gradient is the linear-gradient().
To create a linear gradient you must define at least two colors (or color-stops), and their value can be any type of color format (e.g. Hex, named colors, rgba, hsla, etc.).
The gradient direction can be specified as a 2 words value (e.g. "to top", "to bottom", "to left" and "to right") or it can be specified as an angle value (e.g. "0deg", "90deg"' "180deg").
If you don't declare any value, the default direction will be set "to bottom", meaning the gradient will go from top (color-stop-1) to bottom (color-stop-2).
background: linear-gradient(direction, color-stop1, color-stop2, ...);
background: linear-gradient(to bottom right, #7A7FBA, #11C37C);
You can read more information about browser compatibility here. For maximum cross-browser compatibility and coverage, it's important that you use CSS prefixes. You can use this tool to append CSS prefixes to your CSS code.
CSS Linear Gradients Generator
You can easily generate your own linear gradients with the online css gradient generator.