Comment l'utiliser
- Téléversez, déposez ou collez une image, ou commencez par Essayer une image échantillonnée.
- Déplacez-vous sur l'image pour voir les pixels à proximité dans le loupe, puis cliquez (sur un téléphone, faites glisser et soulevez) pour choisir; les touches fléchées enfoncent un pixel à la fois.
- Copiez HEX, RGB ou HSL, examinez les plus grandes couleurs sous les couleurs dominantes, et exportez-les comme CSS ou JSON.
HEX, RGB et HSL comparés
- HEX: le formulaire hexadécimal #RRGGBB utilisé par les sites Web, Figma et la plupart des logiciels de conception, par exemple #1E3A8A.
- RGB: rouge, vert et bleu valeurs de 0 à 255, par exemple rgb(30, 58, 138), pratique en code et pour ajouter la transparence.
- HSL: teinte (0–360°), saturation et légèreté, par exemple hsl(224, 64%, 33%), pratique pour des teintes plus claires et plus foncées d'une teinte.
Foire aux questions
Comment puis-je obtenir une couleur d'une image?
Téléverser, déposer ou coller une capture d'écran. Déplacez-vous sur l'image pour voir le loupe et cliquez sur l'endroit que vous voulez; sur un téléphone, appuyez et faites glisser avec votre doigt et levez pour choisir. HEX, RGB et HSL valeurs chaque copie en un seul clic.
Dois-je échantillonner 1 pixel ou 5×5?
Utilisez 1 pixel pour les logos, les icônes et les captures d'écran plates; pour les photos, les photos de tissus et les images de produits bruyantes utilisent une moyenne de 3×3 ou 5×5 de sorte qu'un seul pixel errant ne fausse pas le résultat.
Comment les couleurs dominantes fonctionnent-elles?
L'image est réduite et chaque pixel est compté; la coupe médiane plus le regroupement k-means fusionne des couleurs similaires en 3–8 groupes, triés par la part de l'image qu'ils couvrent. Les pixels transparents sont ignorés. Dominant signifie zone plus grande, pas focalisation visuelle.
Pourquoi la couleur choisie diffère-t-elle du fichier de conception ?
Les captures d'écran et les photos sont affectées par la gestion des couleurs d'affichage, la compression JPEG, l'éclairage et l'équilibre blanc de la caméra, de sorte qu'elles peuvent différer du fichier de conception ou des couleurs d'impression telles que Pantone et CMYK. Traitez les lignes directrices de marque comme la source de la vérité et les couleurs choisies comme une correspondance étroite.
Comment utiliser l'exportation CSS et JSON ?
L'exportation de CSS est un ensemble de variables :root telles que --color-1 qui collent directement dans une feuille de style; le JSON liste HEX, RGB, HSL et partage pour les développeurs ou les outils de conception. Vous pouvez également exporter votre historique de couleur choisie.
Mon image est-elle téléversée ?
C'est pas vrai. L'image est décodée et dessinée sur une toile locale dans votre navigateur, et la sélection et l'extraction de palettes s'effectuent sur votre appareil, ce qui convient aux images de produits non libérés et au matériel client.
Quelle est la différence entre HEX, RGB et CMYK, et que dois-je utiliser pour l'impression?
HEX et RGB sont deux façons d'écrire la même couleur d'écran : #FF6600 est RGB(255, 102, 0), utilisé pour les pages Web, les diapositives et les images sociales. CMYK donne les proportions d'encre de l'impression quatre couleurs (cyan, magenta, jaune, noir); certaines couleurs RGB vives ne peuvent pas être imprimées et semblent plus ternes après la conversion. Pour les brochures et les emballages, donnez à l'imprimante des valeurs CMYK ou une référence Pantone et approuvez une preuve; les valeurs HEX choisies à partir d'une image sont les meilleures pour les couleurs de marque sur les sites Web et les matériaux numériques.