Extracteur de Palette Pro — Palette en HEX, HSL, OKLCH, CMYK
Extrayez 3 à 16 couleurs dominantes de n'importe quelle image et obtenez-les en HEX, RGB, HSL, OKLCH et CMYK. Exportez en CSS, SCSS, Tailwind, JSON ou palette PNG. 100% dans votre navigateur.
Extracteur de Palette Pro — Palettes de Couleurs pour Designers et Devs Front
Déposez n’importe quelle image et extrayez une palette de qualité contenant 3 à 16 couleurs dominantes — avec tous les codes dont vous avez besoin : HEX, RGB, HSL, OKLCH et CMYK. Triez par dominance, luminosité ou teinte, visualisez la part de chaque couleur dans l’image grâce à une barre de pourcentage, affichez optionnellement la couleur complémentaire de chaque échantillon, et exportez votre palette en variables CSS, variables SCSS, snippet de config Tailwind, JSON, simple liste hex, ou une image PNG téléchargeable.
Cinq codes couleur par échantillon
Cliquez sur n’importe quel code pour le copier. HEX est le plus courant sur le web ; RGB est la valeur 8 bits brute ; HSL est teinte / saturation / luminosité, idéal pour créer des nuances et des ombres ; OKLCH est l’espace colorimétrique moderne et perceptuellement uniforme supporté par CSS Color Level 4 — parfait pour des palettes accessibles et harmonieuses ; CMYK est l’approximation pour le design d’impression (modèle soustractif).
Six formats d’export
Variables CSS (:root { --color-1: ... }), variables SCSS ($color-1, $color-2…), snippet Tailwind à coller sous extend.colors, JSON avec tous les codes et le pourcentage de dominance, simple liste hex, et une image PNG de palette téléchargeable en 1200×600 avec les étiquettes HEX et RGB sous chaque échantillon — parfait pour partager sur Dribbble ou dans les specs design.
Modes de tri & harmonies
Dominance : les couleurs les plus présentes en premier — la palette photographique. Luminosité : de la plus claire à la plus sombre — utile pour les rampes de valeurs UI. Teinte : dans l’ordre chromatique rouge → orange → jaune → vert → bleu → violet — utile pour les échantillons arc-en-ciel et l’inspiration de dégradés. Le toggle complémentaire affiche un petit triangle de la teinte opposée dans le coin de chaque puce — parfait pour repérer les opportunités de couleur d’accent.
Conseils
Pour de meilleurs résultats, utilisez une photo claire et bien éclairée avec des thèmes visuels forts. Augmentez le nombre de couleurs lorsque l’image est variée ; diminuez-le pour une palette ciblée « prête pour logo ». La barre de dominance est calculée APRÈS le sous-échantillonnage de l’image à environ 200×200 (pour la vitesse) et regroupe les pixels en clusters avec l’algorithme Median Cut — la même méthode utilisée dans la quantification d’image classique.
Confidentialité
Cet outil fonctionne à 100% dans votre navigateur. Votre image est lue dans la mémoire de votre navigateur via l’API FileReader et n’est jamais envoyée à un serveur. Pas d’IA, pas de service externe, pas de librairie à télécharger — juste du JavaScript pur qui calcule sur les pixels de l’image. Rien n’est stocké ; fermer l’onglet efface tout.
Recherche simple et rapide ? Essayez Extracteur de Couleurs d’Image