How to use gradients in css?

CSS gradientsare represented by the<gradient>data type, a special type of<image>made of a progressive transition between two or more colors. We can choose between three types of gradients:linear(created with thelinear-gradient()function),radial(created withradial-gradient()), andconic(created with theconical-gradientfunction). You can also create repeating gradients with therepeating-linear-gradient()andrepeating-radial-gradient()functions.

Gradients can be used anywhere you would use an<image>, such as in backgrounds. Because gradients are dynamically generated, they can negate the need for the raster image files that traditionally were used to achieve similar effects. In addition, because gradients are generated by the browser, they look better than raster images when zoomed in, and can be resized on the fly.

We're Ready, Let's Talk