Écrire un dégradé à la main oblige à modifier le CSS, enregistrer et recharger jusqu’à ce que l’angle soit bon. Ce générateur offre un aperçu en direct : choisissez le type, l’angle et les arrêts de couleur, observez le résultat et copiez un CSS prêt pour la production, sans préfixe et compatible avec tous les navigateurs actuels.
0deg pointe vers le haut et les angles augmentent dans le sens des aiguilles d’une montre : 90deg va de gauche à droite et 180deg de haut en bas. Cela diffère de la convention mathématique et déroute souvent.
Parce que l’interpolation en sRGB passe par un point intermédiaire désaturé, surtout entre couleurs complémentaires. Ajouter un arrêt intermédiaire, ou utiliser l’interpolation en oklch des navigateurs récents, corrige le problème.
Non. linear-gradient et radial-gradient sans préfixe fonctionnent depuis des années dans tous les navigateurs actuels. Les préfixes ne font qu’alourdir le fichier.
Pas directement par une transition, car background-image ne s’interpole pas. L’astuce habituelle consiste à animer background-position sur un dégradé surdimensionné, ou à utiliser des propriétés personnalisées déclarées avec @property.
Formateur JSON · Encodeur Base64 · Encodeur d’URL · Décodeur JWT · Voir tous les outils
Également disponible en : English · Español · Português · Deutsch