Générateur de dégradé radial CSS
Créez visuellement des dégradés CSS : type linéaire, radial ou conique, curseur d'angle et jusqu'à six arrêts de couleur avec un aperçu pleine largeur en direct et un code copiable.
Résultat
Cette page ouvre le générateur de dégradé avec le type radial déjà sélectionné : les couleurs rayonnent vers l'extérieur depuis le centre de l'élément en cercles concentriques, et chaque arrêt que vous modifiez repeint instantanément l'aperçu.
radial-gradient() est l'outil pour les effets de projecteur et de lueur, les vignettes douces et les arrière-plans qui nécessitent un point focal plutôt qu'une direction. Les positions des butées en pourcentage correspondent à la distance du centre - 0 % est le milieu, 100 % le bord éloigné - donc le serrage des premières butées crée un petit noyau brillant, les étaler donne un large lavage.
Copiez la ligne d'arrière-plan une fois que l'aperçu semble correct. Le curseur d'angle est masqué dans ce mode car un cercle n'a pas de direction : revenez en mode linéaire ou conique et il réapparaît.