Extrayez les couleurs dominantes d’une image téléversée en échantillonnant les pixels, en quantifiant les valeurs proches et en classant les nuanciers les plus fréquents. Chaque résultat inclut un code CSS hex et le tuple RGB correspondant via le helper de couleur partagé.
Algorithme (simplifié)
- Dessiner l’image sur un canvas en pleine résolution
- Parcourir les pixels avec un pas (un pixel sur 4 par défaut) pour les performances
- Ignorer les pixels surtout transparents (alpha inférieur à 128)
- Quantifier les canaux en buckets de 32 pas pour fusionner les quasi-doublons
- Trier les buckets par fréquence et renvoyer les N couleurs principales
Il s’agit d’une palette basée sur la fréquence, pas d’un clustering perceptuel (pas de k-means). Elle convient aux graphiques d’UI plats et aux affiches ; les photos bruitées peuvent renvoyer des tons moyens ternes.
Quand l’utiliser
- Amorcer une palette à partir d’une photo de marque ou d’un logo raster
- La coupler aux outils Colors (
from-hex-to-rgb) pour d’autres conversions - Documenter des design tokens extraits de captures marketing
Limites
Les JPEG fortement compressés et les dégradés produisent des couleurs moyennées. Les fonds PNG/WebP transparents sont ignorés lorsque l’alpha est bas. Les très grandes images sont échantillonnées de façon sparse—le détail extrême peut manquer. Les résultats sont indicatifs et ne remplacent pas des extracteurs de palette professionnels.
Exemple
Par exemple, saisissez les valeurs d’exemple par défaut du formulaire et comparez la sortie à une référence connue ; ajustez une entrée à la fois pour voir l’effet.