Générateur de dégradés CSS

Écrire linear-gradient(135deg, #2193b0 0%, #6dd5ed 100%) à la main et recharger la page pour le voir est une boucle lente. Ce générateur y met fin : choisissez linéaire, radial ou conique, déplacez le curseur d'angle, définissez chaque arrêt de couleur avec un sélecteur natif et une position en pourcentage — et l'aperçu pleine largeur se redessine à chaque modification, la ligne de fond finale étant toujours prête à être copiée.

Les trois types de dégradés couvrent des besoins différents. Les dégradés linéaires fondent dans une direction et portent la plupart des sections héros et des boutons ; les dégradés radiaux rayonnent depuis le centre pour les lueurs et les vignettes ; les dégradés coniques balayent autour du centre et alimentent les camemberts et les cercles chromatiques. Vous pouvez changer de type à tout moment — vos arrêts sont conservés, donc comparer les trois ne prend que quelques secondes.

Jusqu'à six arrêts de couleur vous donnent de la marge pour des conceptions à bandes multiples, et les pages préréglées livrent des combinaisons éprouvées — un coucher de soleil chaud, un océan calme et une paire pastel douce — comme points de départ que vous pouvez ajuster plutôt que des toiles vierges. Notez la répartition des tâches : le générateur de palettes de couleurs de ce site choisit des couleurs plates harmonieuses et le convertisseur de formats de couleur traduit une valeur entre HEX, RGB et HSL, tandis que cet outil a un rôle différent — il transforme les couleurs choisies en code de dégradé CSS prêt à l'emploi.

Tout s'exécute localement dans votre navigateur : pas de téléversement, pas de compte, pas d'allers-retours avec le serveur, et le générateur continue de fonctionner hors ligne une fois chargé.