Générateur de dégradé depuis une image

Tous les outils

Extrayez un superbe dégradé de n'importe quelle photo — déposez une image, choisissez une ambiance, et les couleurs dominantes deviennent des points de dégradé déplaçables. Copiez le CSS prêt à coller instantanément.

Glissez-déposez une image ici

ou cliquez pour parcourir — vous pouvez aussi coller depuis le presse-papiers

Tout se passe dans votre navigateur — votre image n'est jamais téléversée, aucune inscription, entièrement gratuit.

Image source
Lecture des couleurs…
Image source
Ambiance
Couleurs extraites
Voici les couleurs dominantes extraites de votre image. Cliquez sur un échantillon pour le copier, ou faites glisser les points ci-dessous pour ajuster le dégradé.
Aperçu du dégradé
Type de dégradé
Angle
°
Points de couleur
Faites glisser une poignée pour déplacer un point, ou cliquez sur la barre pour en ajouter un. Sélectionnez un point pour modifier sa couleur.
Point sélectionné
%
CSS
background: —;

À propos de Générateur de dégradé depuis une image

Le Générateur de dégradé à partir d'image transforme n'importe quelle photo en un dégradé CSS prêt à l'emploi. Déposez, parcourez ou collez une image et l'outil la lit sur un canvas, en extrait les couleurs dominantes et les dispose en points d'arrêt de dégradé que vous pouvez déplacer, recolorer et réordonner jusqu'à ce que le mélange corresponde à l'ambiance de l'original.

Un sélecteur d'ambiance — Coloré, Lumineux, Adouci, Profond ou Sombre — change quelles couleurs extraites deviennent des points d'arrêt, si bien qu'une même photo peut donner plusieurs dégradés très différents. Vous contrôlez le type de dégradé (linéaire, radial ou conique), l'angle, et les points d'arrêt eux-mêmes : cliquez sur la barre pour en ajouter un, faites glisser pour repositionner, inversez ou faites pivoter en un clic.

Tout le processus s'exécute dans votre navigateur ; votre image n'est jamais téléversée vers un serveur. Quand l'aperçu vous convient, copiez la règle CSS complète, seulement la valeur de fond, ou les couleurs extraites seules — idéal pour les sections héros, les fonds de page et les visuels de marque dérivés de photographies.

Comment utiliser Générateur de dégradé depuis une image

  1. Glissez-déposez une image, cliquez pour la parcourir, ou collez-en une depuis votre presse-papiers.
  2. Choisissez une ambiance — Coloré, Lumineux, Adouci, Profond ou Sombre — pour définir quelles couleurs extraites deviennent des points d'arrêt.
  3. Sélectionnez le type de dégradé (linéaire, radial ou conique) et ajustez l'angle.
  4. Déplacez les points d'arrêt pour affiner le mélange ; ajoutez, retirez, inversez ou remélangez les points selon vos besoins.
  5. Cliquez sur « Copier le CSS » pour récupérer le code de dégradé prêt à coller.

Questions fréquentes

Non. L'image est lue directement dans un canvas dans votre navigateur, et l'extraction des couleurs comme le calcul du dégradé se font localement. Rien ne quitte votre appareil à aucun moment.

Oui, entièrement. Comme tout s'exécute côté client, il n'y a ni crédits, ni compte, ni limite — extrayez des dégradés d'autant d'images que vous le souhaitez.

Cet outil part d'une photo : il extrait les couleurs dominantes de l'image et construit le dégradé à partir d'elles. Le Générateur de dégradé classique part de zéro avec des couleurs que vous choisissez vous-même. Les deux produisent le même type de CSS modifiable et prêt à copier.

Les ambiances reclassent les couleurs extraites de votre image : Coloré favorise des teintes vives et variées, Lumineux choisit des tons clairs et saturés, Adouci sélectionne des tons plus doux et désaturés, et Profond et Sombre tirent des couleurs plus riches et plus foncées. Changer d'ambiance reconstruit instantanément les points d'arrêt du dégradé.

Oui. Chaque point d'arrêt est déplaçable, vous pouvez cliquer sur la barre pour ajouter des points ou retirer ceux sélectionnés, changer la couleur de n'importe quel point, basculer entre linéaire, radial et conique, faire pivoter l'angle par paliers de 45°, inverser la direction, ou remélanger de nouvelles couleurs depuis l'image.
Partager
Outils similaires
Générateur de dégradé Composez des dégradés CSS linéaires, radiaux et coniques de A à Z, avec gestion multi-points déplaçables et préréglages soignés. Copiez le CSS prêt à coller instantanément. Gratuit
Extracteur de couleurs d'image Extrayez une palette de couleurs raffinée et prête à copier depuis n’importe quelle image. Gratuit
Générateur de palette de couleurs Composez des palettes de couleurs harmonieuses à partir d'une roue chromatique interactive — appliquez des règles d'harmonie comme analogue, complémentaire ou triade, puis copiez n'importe quelle valeur instantanément. Gratuit
Écran tout noir Remplissez tout votre écran de noir pur — parfait pour repérer les pixels brillants bloqués, vérifier les fuites de rétroéclairage ou comme fond sombre sans distraction. Gratuit. Gratuit
Pipette d'écran Échantillonnez n'importe quel pixel de votre écran avec la pipette, ou prélevez des couleurs depuis une image déposée, et regroupez-les en une palette prête à copier. Gratuit
Générateur de nuances de couleur Générez une gamme complète de teintes claires et foncées à partir d'une seule couleur — choisissez votre pas d'éclaircissement/assombrissement et le nombre de nuances, puis copiez n'importe quelle valeur instantanément. Gratuit
Recherches populaires
dégradé depuis une image extraire un dégradé d'une photo image vers dégradé css générateur de dégradé de photo créer un dégradé depuis une image dégradé css depuis image
Besoin d'aide ?
Un problème avec cet outil ? Signalez-le à notre équipe.
Signaler un problème

Ajoutez cet outil gratuit à votre propre site web — copiez-collez le code ci-dessous.