Un gradient CSS est une image générée : la fonction définit la géométrie et les points ordonnés définissent les transitions. GradientForge expose seulement les valeurs du code copié afin que l’aperçu reste vérifiable.
Reliez contrôles et éléments
Choisissez d’abord la fonction puis lisez le préfixe avant les points. Linear utilise un angle ; radial un cercle ou une ellipse avec position at ; conic un angle from et une position at. Chaque couleur porte un pourcentage explicite, sans espacement automatique caché. Modifiez un contrôle à la fois et comparez code et aperçu.
Conservez l’ordre canonique
GradientForge trie les points par pourcentage et garde l’ordre d’insertion en cas d’égalité. La sortie reste stable et deux points égaux créent une coupure nette. Ajouter choisit le plus grand intervalle, le premier en cas d’égalité, place le point au milieu entier et utilise la couleur sRGB moyenne arrondie. Le même document produit toujours le même code.
Vérifiez la déclaration dans son contexte réel
GradientForge prévisualise la déclaration avec le moteur du navigateur actuel sans certifier accessibilité ou compatibilité. Collez background-image dans le composant réel, gardez un background-color de repli et testez chaque navigateur et taille responsive pris en charge. Contrôlez le contraste du texte avec un outil dédié dans les zones les plus claires et les plus sombres : il peut réussir à un endroit et échouer ailleurs. Conservez l’ordre généré, car des points à la même position créent volontairement une coupure nette. La capsule ne garde ni palette ni historique ; enregistrez le CSS accepté dans votre fichier versionné avant rechargement.