Extraire une palette pixel art utile

Commencez avec le fichier aux pixels encore propres

Utilisez le PNG original si vous l’avez. Une capture d’écran JPEG peut introduire des valeurs RGB légèrement différentes autour de chaque contour : un personnage peint avec six couleurs intentionnelles peut alors sembler en contenir des centaines. Un WebP avec perte peut faire de même. L’extracteur de palette compte exactement les couleurs décodées ; il ne fait pas semblant que ces nouvelles nuances proches sont la même couleur.

Avant l’importation, retirez les éléments d’interface, bordures ou grands fonds unis sans rapport si vous voulez la palette du personnage. Sinon, le fond peut arriver en tête simplement parce qu’il occupe le plus de pixels. Pour un sprite transparent, ajustez le seuil alpha minimal afin d’ignorer les pixels presque invisibles des contours.

Palette pratique de six couleurs pour personnage

Imaginez un héros de 32 × 32 portant une veste bleue. La liste extraite comprend deux bleus, un reflet pâle, un contour sombre, la peau et un accent chaud. Ne copiez pas aveuglément les six couleurs les plus fréquentes. Classez-les par fonction : contour, ombre de la veste, base de la veste, reflet de la veste, peau et accent. La séquence ombre-base-reflet est une rampe de couleurs. Cette relation importe plus que l'ordre de fréquence des couleurs.

1. Chargez le sprite propre et examinez les fréquences. Copiez les codes hex des couleurs appartenant visiblement au personnage.
2. Notez chaque code à côté de son rôle : par exemple, ombre de veste, base de veste, lumière de veste. Si deux codes semblent identiques, agrandissez l’original avant de décider s’ils sont tous deux intentionnels.
3. Dessinez un nouveau personnage avec la même logique de contours et de rampes. Réutilisez les couleurs exactes lorsque la cohérence est utile, mais changez les accents ou les matières si le personnage doit avoir une identité différente.
4. Exportez en CSS ou JSON pour préserver les valeurs choisies. Considérez cet export comme une liste de travail, pas comme la preuve que toutes les couleurs comptées doivent appartenir à la palette finale.

Pourquoi une photo donne un résultat peu utile

Une photo a beaucoup de dégradés et variations de compression. Le comptage exact trouve les RGB fréquents, sans regrouper ni choisir des gammes plaisantes. Si vous voulez réduire une photo à douze couleurs stylisées, il vous faut une quantification ou une conception manuelle de palette, pas une simple extraction. L’outil ImageMint indique volontairement ce qui se trouve dans les pixels ; il ne recolore pas l’image.

Gardez une référence aux couleurs nommées pour les grands projets ; analysez les nouveaux dessins. Agrandissement par voisin le plus proche peut faciliter l’examen des pixels existants, mais ne peut pas annuler un flou déjà intégré à la source. Récupérez un original sans perte si possible.

Interpréter correctement l’alpha et les pourcentages

Un canevas 32 × 32 contient 1024 pixels. Si 600 dépassent le seuil alpha et 150 portent la couleur de veste, la fréquence est 150 ÷ 600 = 25%, non 150 ÷ 1024. La transparence ne compte pas comme couleur ; baisser le seuil peut réintroduire des bords ténus.

Le seuil par défaut de 128 inclut les pixels à peu près à moitié opaques et au-delà. Une valeur de 255 inclut uniquement les pixels entièrement opaques. Commencez à 255 pour un dessin volontairement net, puis comparez avec 128 si le sprite possède des bords doux utiles. Modifier Alpha minimal efface le résultat précédent ; relancez l’analyse avant de comparer les comptes.

Exporter une sélection sans perdre les accents rares

Les limites 8, 16, 32 et 64 concernent l’affichage et l’export. Elles ne réduisent pas les couleurs de l’image. Si les huit principales couvrent 85% des pixels retenus, les 15% restants correspondent aux couleurs masquées. Augmentez la limite pour examiner un reflet d’œil ou un petit accent avant de considérer la sélection complète.

Le téléchargement CSS utilise des variables numérotées comme --pixel-color-01. Le classement change avec la pose ; n'en faites pas un rôle stable comme « ombre-veste ». Renommez vos variables après affectation. JSON conserve couleurs et nombres, pas une image à palette indexée ni des instructions de recoloration.

Validez la palette sur de vrais dessins

1. Dessinez une nouvelle pose avec le contour et trois couleurs de matériau choisis.
2. Placez-le à côté de la source à l’échelle native. Vérifiez la lisibilité de la silhouette et des accents importants.
3. Analysez le nouveau PNG et cherchez des nuances dues au pinceau doux ou au lissage.
4. Gardez couleurs nommées et original propre : les comptes complètent le jugement visuel.