Adding gradients to a website can help enhance its design and overall aesthetic. In this article, we will explore how to add gradients to your website using HTML and CSS.
HTML CSS gradient
In CSS, you can add a gradient background to an HTML element using the background-image
property and the linear-gradient
function.
Here’s an example of a linear gradient from top to bottom, transitioning from red to blue:
body {
background-image: linear-gradient(to bottom, red, blue);
}
If you want to add a radial gradient, you can use the radial-gradient
function instead.
Here’s an example of a radial gradient transitioning from yellow in the center to blue at the edges:
body {
background-image: radial-gradient(yellow, blue);
}
In this way, you can create a gradient for your website or background. Thank you.