Dégradé CSS depuis une image
Importez une photo ou une illustration : ses couleurs dominantes sont extraites puis assemblées automatiquement en un dégradé CSS linear-gradient prêt à copier. Traitement 100% local dans votre navigateur (WebAssembly) — votre image n'est jamais envoyée à un serveur.
Comment ça marche
Reprendre l'ambiance colorée d'une photo pour un fond de section, une bannière ou une carte produit sans dupliquer l'image elle-même : c'est exactement ce que fait cet outil. Il analyse les pixels de l'image importée pour en extraire les teintes les plus représentées, puis les assemble dans l'ordre en un dégradé linéaire dont vous pouvez ajuster l'angle avant de copier la propriété CSS finale.
Le dégradé garde-t-il le même ordre de couleurs que l'image ?
Les couleurs sont classées de la plus fréquente à la moins fréquente dans l'image source, et le dégradé les enchaîne dans cet ordre. Si le résultat ne vous convient pas visuellement, vous pouvez copier le code puis réordonner les couleurs manuellement dans votre feuille de style.
Combien de couleurs choisir pour un rendu propre ?
Deux ou trois couleurs donnent en général un dégradé lisible et élégant, proche d'un fond de section classique. Au-delà de quatre couleurs, le résultat peut devenir plus proche d'un arc-en-ciel que d'un dégradé subtil, à réserver aux effets volontairement marqués.
Confidentialité : l'extraction des couleurs et la génération du CSS s'effectuent entièrement dans votre navigateur via WebAssembly, sans upload de votre image sur un serveur.