Pour passer d'une couleur à une autre, avec un effet de dégradé, en HTML, vous pouvez associer la fonction CSS linear-gradient() à la propriété CSS background.
La fonction linear-gradient() contient 3 paramètres :
- La direction, exprimée avec un mot clef ou en degrés (
to bottom correspond à 180°).
- La couleur de départ.
- La couleur de fin.
Voici un exemple pour appliquer au fond d'une page, un dégradé du gris au noir, de haut en bas :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Comment faire un dégradé de couleur en HTML et CSS ?</title>
<style>
body {
height: 100vh;
background: linear-gradient(to bottom, grey, black);
}
</style>
</head>
<body>
</body>
</html>
Remarque : Vous trouverez d'avantage d'information sur les manières de réaliser des dégradés de couleur, en HTML et CSS, via cette page du site de Mozilla.
