Programme de pipette pour déterminer la couleur. Colorimètre de l’App Store

Si vous possédez votre propre site Internet, alors, volontairement ou involontairement, vous devrez maîtriser les outils et les compétences des différents métiers de l'Internet. Les outils du concepteur devront être étudiés avec une attention particulière, car le chemin qui mène au cœur du lecteur passe par une image professionnelle. De belles images bien choisies sur votre site Internet augmentent la probabilité de lire l’information, c’est un fait ! Le fait que ces images doivent être uniques est également un fait irréfutable. Pour apprendre à créer des images par nous-mêmes, nous devons apprendre beaucoup de détails, et l'un d'eux consiste à déterminer la couleur de n'importe quel élément d'une page Internet. Aujourd'hui, nous allons parler de la façon de connaître la couleur d'arrière-plan d'une page.

Je sais qu'il existe de nombreuses autres méthodes et outils, mais je partage mon expérience pratique dans la création d'images. Si vous n'êtes pas un designer professionnel, cet article vous sera très utile dans vos futurs travaux. Vous pouvez reconnaître la couleur sur une page à l'aide d'un plugin utile ColorZilla pour les navigateurs Mozilla Firefox et Google Chrome.

Quand avons-nous besoin de cet outil ?

— Si vous concevez un site Web ;
— Si vous créez un nouveau bloc publicitaire correspondant à la palette de couleurs du site ;
— Si vous créez une palette de couleurs de styles pour le site ;
— Si vous êtes occupé à dessiner des éléments d'un projet virtuel ;
— Si vous créez une image ;
— Dans tous les autres cas où vous devez déterminer la couleur d'un pixel sans exécuter de programmes à grande échelle et gourmands en ressources tels que PhotoShop ou ColorDraw.

Comment utiliser ColorZilla ?

Tout est très simple ! Allez sur le site Web, cliquez sur l'icône de gauche et sélectionnez l'onglet dont vous avez le plus besoin :

— Mozilla Firefox (outil de navigation) ;
— Google Chrome (outil de navigation) ;
— Générateur de dégradé (outil en ligne).

Téléchargez le plugin de navigateur souhaité et après l'installation, l'icône d'extension sera toujours dans le panneau de votre navigateur. N'oubliez pas d'activer le plugin, cliquez simplement sur l'icône.

Comment utiliser l'extension ColorZilla

J'écrirai avec des mots simples sur la façon dont je travaille avec cette extension. Lors de la création ou de la modification d'une image dans l'éditeur Canva, sur laquelle vous pouvez en savoir plus si vous suivez ce lien, il peut être nécessaire d'ajouter un arrière-plan identique à l'image originale. Sur l'image, vous pouvez voir que sur le côté droit, il y a une partie du fond blanc qui pourrait être colorée pour correspondre à la couleur de fond de l'image. Sans une telle extension, il est très problématique de le faire, peut-être en utilisant une méthode de sélection qui ne donnera pas une identité à 100 %. En cliquant sur la pipette dans l'extension, puis en cliquant avec le bouton gauche sur n'importe quel pixel de l'image, une superbe info-bulle apparaît en haut qui me donne le code couleur en hexadécimal et RVB.

Pour travailler avec l'éditeur Canva, j'ai uniquement besoin du format hexadécimal. Je le copie, puis dans l'éditeur Canva je saisis la valeur de cette couleur, et je suis très content du résultat. Ainsi, en quelques mouvements seulement, je peux sélectionner une couleur identique, ajoutant ainsi un caractère unique à l'image originale en modifiant sa taille.

Je vous suggère de vous asseoir un moment et de vous familiariser avec tous les outils de cette extension qui sont dans le menu. Vous en trouverez certainement quelques-uns que vous utiliserez avec un plaisir particulier. Et vous maîtriserez le reste au fil du temps. Vous savez mieux que moi que dans une image, vous pouvez non seulement changer le fond, mais aussi qu'il est nécessaire d'écrire quelque chose. Choisir la bonne couleur de police n’est pas non plus aussi simple qu’il y paraît à première vue. Vous préférerez peut-être une palette ou un générateur de dégradés plutôt qu'une pipette. Je suis sûr d'une chose : avec ColorZilla, tous les problèmes peuvent être résolus très rapidement.

Comme toujours, il vaut mieux voir une fois que lire cent fois ! Par conséquent, je vous suggère de regarder une vidéo dans laquelle vous apprendrez comment installer l'extension ColirZilla et l'utiliser dans votre travail. Je vous souhaite un agréable visionnage et de belles photos uniques !

Probablement l'un des premiers utilitaires de ce type, mais il ne perd néanmoins pas sa popularité auprès des webmasters.
Le programme affiche le code HTML de la couleur sélectionnée et, à l'inverse, indique la couleur par code.

Pour déterminer la couleur sur le moniteur, cliquez sur le bouton Écran, pointez le pointeur sur le point souhaité et cliquez une fois à cet endroit. Le champ Code HTML affichera la couleur dans le code HTML. Il ne reste plus qu'à copier ce code dans le presse-papiers et à le coller à l'emplacement souhaité.
Avantages : le programme pèse très peu et est extrêmement simple

Programme de sélection de couleurs

L'avantage de ce programme est qu'il affiche les couleurs en code RVB ou HSL, et bien sûr en HTML.

Pour déterminer la couleur, vous devez cliquer sur le bouton "Sélectionner la couleur avec la souris", le curseur de la souris prendra la forme d'une pipette, il vous suffira de déplacer le curseur à l'emplacement souhaité et de cliquer dessus. Le programme est compatible avec les versions de Windows XP et supérieures.
Nécessite une installation sur un ordinateur.

Juste un sélecteur de couleurs

Je pense que c'est elle que je préfère. Concrètement, ce qui m'aide beaucoup, c'est qu'après avoir capturé une couleur, une barre apparaît dans l'interface avec une tonalité et une luminosité variables de cette couleur. Ceux. Je peux déplacer la souris sur la bande et saisir quelques couleurs similaires, par exemple légèrement plus lumineuses, pour une sélection ultérieure de la couleur optimale.

  • Lorsque vous démarrez pour la première fois, il vous invite à sélectionner une langue, le russe est présent.
  • L'interface de Just Color Picker comprend une loupe d'écran.
  • Vous permet d'enregistrer plusieurs couleurs.
  • Prend des lectures non pas avec un clic de souris, mais avec les touches de raccourci Alt+X (par défaut), ce qui vous permet de déterminer plus précisément la couleur
  • Après avoir défini une couleur, le programme déterminera automatiquement des couleurs supplémentaires qui seront en harmonie avec celle sélectionnée et qui pourront être utilisées dans le design.
  • Ne nécessite pas d'installation, fonctionne en arrière-plan.

Le programme est compatible avec les versions de Windows XP et supérieures.

A noter également le programme gratuit ColorPic 4.1. Son seul inconvénient est qu'il nécessite une installation sur un ordinateur, c'est-à-dire ne peut pas fonctionner en arrière-plan.

Mais il présente suffisamment d’avantages. Le programme n'est pas tout à fait simple, c'est pourquoi une description et des instructions pour l'utiliser sont fournies sur ce site dans un article séparé.

Très souvent, lorsque vous travaillez avec des sites Web et des images, vous avez besoin déterminer la couleur n'importe quel point sur l'écran de votre moniteur.

Par exemple, vous souhaitez que la couleur d’arrière-plan de votre site Web soit exactement la même que la couleur du ciel bleu sur la photo. Ou faites en sorte que la police du titre ait la même couleur que le vert d'eau. Ou vice versa, utilisez la couleur de la police comme arrière-plan pour créer une bannière. Bref, les options sont nombreuses. Une sélection minutieuse des couleurs signifie beaucoup tant dans la conception de sites Web que dans le travail d'un webmaster.

Déterminer une couleur, c’est trouver son code. Ensuite le code, en fonction de vos objectifs, peut être utilisé aussi bien dans différents éditeurs graphiques que directement dans le code html.

Le plus souvent, il est utilisé dans lequel le code peut être représenté en systèmes décimaux et hexadécimaux.

Il est très pratique d'utiliser une pipette pour déterminer la couleur. Mais en plus de ce programme, il en existe d’autres avec lesquels vous pouvez faire cela.

Pipette Adobe Photoshop

Je pense que peu d'utilisateurs de ce programme savent qu'en l'utilisant, vous pouvez déterminer la couleur non seulement n'importe quel point de l'image ouverte dans l'éditeur, mais également n'importe quel point de l'écran de votre moniteur.

Cela se fait très simplement. Ouvrez, créez une image dedans et, sans relâcher le bouton gauche de la souris, déplacez le curseur de la pipette là où se trouve le point que vous avez sélectionné. Cela peut être n'importe quel point en dehors de la fenêtre du programme. En déplaçant le curseur, vous verrez comment la couleur du dessin change dans la palette de couleurs. Après avoir sélectionné le point souhaité, relâchez le bouton de la souris. Cliquez sur la case de couleur du dessin dans la palette de couleurs et voyez le code de votre couleur.

Cette méthode de détermination de la couleur est pratique car elle ne nécessite l'installation d'aucun programme supplémentaire à l'exception de Photoshop, que la plupart des utilisateurs ont déjà installé.

HEX/HTML

La couleur HEX n'est rien d'autre qu'une représentation hexadécimale du RVB.

Les couleurs sont représentées par trois groupes de chiffres hexadécimaux, où chaque groupe est responsable de sa propre couleur : #112233, où 11 est rouge, 22 est vert et 33 est bleu. Toutes les valeurs doivent être comprises entre 00 et FF.

De nombreuses applications autorisent une forme abrégée de notation hexadécimale des couleurs. Si chacun des trois groupes contient les mêmes caractères, par exemple #112233, alors ils peuvent s'écrire #123.

  1. h1 ( couleur : #ff0000; ) /* rouge */
  2. h2 ( couleur : #00ff00; ) /* vert */
  3. h3 ( couleur : #0000ff; ) /* bleu */
  4. h4 ( couleur : #00f; ) /* même bleu, sténographie */

RVB

L'espace colorimétrique RVB (Rouge, Vert, Bleu) comprend toutes les couleurs possibles qui peuvent être créées en mélangeant le rouge, le vert et le bleu. Ce modèle est populaire en photographie, à la télévision et en infographie.

Les valeurs RVB sont spécifiées sous forme d'entier compris entre 0 et 255. Par exemple, rgb(0,0,255) s'affiche en bleu car le paramètre bleu est défini sur sa valeur la plus élevée (255) et les autres sont définis sur 0.

Certaines applications (en particulier les navigateurs Web) prennent en charge l'enregistrement en pourcentage des valeurs RVB (de 0 % à 100 %).

  1. h1 ( couleur : rgb(255, 0, 0); ) /* rouge */
  2. h2 ( couleur : rgb(0, 255, 0); ) /* vert */
  3. h3 ( couleur : rgb(0, 0, 255); ) /* bleu */
  4. h4 ( couleur : rgb(0%, 0%, 100%); ) /* même bleu, entrée en pourcentage */

Les valeurs de couleur RVB sont prises en charge dans tous les principaux navigateurs.

RVBA

Récemment, les navigateurs modernes ont appris à travailler avec le modèle de couleur RGBA - une extension de RVB prenant en charge un canal alpha, qui détermine l'opacité d'un objet.

La valeur de couleur RGBA est spécifiée comme suit : rgba (rouge, vert, bleu, alpha). Le paramètre alpha est un nombre allant de 0,0 (entièrement transparent) à 1,0 (entièrement opaque).

  1. h1 ( color: rgb(0, 0, 255); ) /* bleu en RVB normal */
  2. h2 ( color: rgba(0, 0, 255, 1); ) /* le même bleu en RGBA, car opacité : 100% */
  3. h3 ( couleur : rgba(0, 0, 255, 0.5); ) /* opacité : 50% */
  4. h4 ( couleur : rgba(0, 0, 255, .155); ) /* opacité : 15,5% */
  5. h5 ( couleur : rgba(0, 0, 255, 0); ) /* complètement transparent */

RGBA est pris en charge dans IE9+, Firefox 3+, Chrome, Safari et Opera 10+.

LGV

Le modèle de couleur HSL est une représentation du modèle RVB dans un système de coordonnées cylindriques. HSL représente les couleurs d'une manière plus intuitive et lisible par l'homme que le RVB typique. Le modèle est souvent utilisé dans les applications graphiques, les palettes de couleurs et l'analyse d'images.

HSL signifie Hue (couleur/teinte), Saturation (saturation), Lightness/Luminance (luminosité/luminosité/luminosité, à ne pas confondre avec luminosité).

Hue spécifie la position de la couleur sur la roue chromatique (de 0 à 360). La saturation est la valeur en pourcentage de la saturation (de 0% à 100%). La légèreté est un pourcentage de légèreté (de 0% à 100%).

  1. h1 ( couleur : hsl(120, 100%, 50%); ) /* vert */
  2. h2 ( couleur : hsl(120, 100%, 75%); ) /* vert clair */
  3. h3 ( couleur : hsl(120, 100%, 25%); ) /* vert foncé */
  4. h4 ( couleur : hsl(120, 60%, 70%); ) /* vert pastel */

HSL est pris en charge dans IE9+, Firefox, Chrome, Safari et Opera 10+.

HSLA

Semblable à RVB/RGBA, HSL dispose d'un mode HSLA qui prend en charge un canal alpha pour indiquer l'opacité d'un objet.

La valeur de couleur HSLA est spécifiée comme suit : hsla (teinte, saturation, luminosité, alpha). Le paramètre alpha est un nombre allant de 0,0 (entièrement transparent) à 1,0 (entièrement opaque).

  1. h1 ( color: hsl(120, 100%, 50%); ) /* vert en HSL normal */
  2. h2 ( color: hsla(120, 100%, 50%, 1); ) /* le même vert en HSLA, car opacité : 100% */
  3. h3 ( couleur : hsla(120, 100%, 50%, 0.5); ) /* opacité : 50% */
  4. h4 ( couleur : hsla(120, 100%, 50%, .155); ) /* opacité : 15,5% */
  5. h5 ( couleur : hsla(120, 100%, 50%, 0); ) /* complètement transparent */

CMJN

Le modèle de couleur CMJN est souvent associé à l'impression et à l'impression couleur. CMJN (contrairement au RVB) est un modèle soustractif, ce qui signifie que des valeurs plus élevées sont associées à des couleurs plus sombres.

Les couleurs sont déterminées par le rapport cyan (Cyan), magenta (Magenta), jaune (Jaune), avec l'ajout de noir (Key/noir).

Chacun des nombres qui définissent une couleur en CMJN représente le pourcentage d'encre d'une couleur donnée qui compose la combinaison de couleurs, ou plus précisément, la taille du point de trame qui est imprimé sur la photocomposeuse sur un film de cette couleur (ou directement sur la plaque d'impression dans le cas du CTP).

Par exemple, pour obtenir la couleur PANTONE 7526, vous devez mélanger 9 parts de cyan, 83 parts de magenta, 100 parts de jaune et 46 parts de noir. Cela peut être noté comme suit : (9,83,100,46). Parfois, les désignations suivantes sont utilisées : C9M83Y100K46, ou (9 %, 83 %, 100 %, 46 %), ou (0,09/0,83/1,0/0,46).

HSB/HSV

HSB (également connu sous le nom de HSV) est similaire au HSL, mais il s'agit de deux modèles de couleurs différents. Ils sont tous deux basés sur une géométrie cylindrique, mais HSB/HSV est basé sur le modèle « hexcone », tandis que HSL est basé sur le modèle « bi-hexcone ». Les artistes préfèrent souvent utiliser ce modèle, il est généralement admis que le dispositif HSB/HSV est plus proche de la perception naturelle des couleurs. En particulier, le modèle de couleur HSB est utilisé dans Adobe Photoshop.

HSB/HSV signifie Hue (couleur/teinte), Saturation (saturation), Brightness/Value (luminosité/valeur).

Hue spécifie la position de la couleur sur la roue chromatique (de 0 à 360). La saturation est la valeur en pourcentage de la saturation (de 0% à 100%). La luminosité est un pourcentage de luminosité (de 0 % à 100 %).

XYZ

Le modèle de couleur XYZ (CIE 1931 XYZ) est un espace purement mathématique. Contrairement aux modèles RVB, CMJN et autres, dans XYZ, les composants principaux sont « imaginaires », ce qui signifie que vous ne pouvez pas associer X, Y et Z à un ensemble de couleurs à mélanger. XYZ est le modèle principal de presque tous les autres modèles de couleurs utilisés dans les domaines techniques.

LABORATOIRE

Le modèle de couleur LAB (CIELAB, « CIE 1976 L*a*b* ») est calculé à partir de l'espace CIE XYZ. L'objectif de conception de Lab était de créer un espace colorimétrique dans lequel les changements de couleur seraient plus linéaires en termes de perception humaine (par rapport à XYZ), c'est-à-dire de sorte que le même changement de valeurs de coordonnées de couleur dans différentes régions de l'espace colorimétrique serait produisent la même sensation de changement de couleur.

Lorsque vous travaillez avec des images, vous devez souvent déterminer avec précision la couleur d'un pixel. Ceci est nécessaire pour la correction d'image ou dans les travaux de conception pour ajuster la palette de couleurs de l'arrière-plan, des panneaux ou des boutons de votre page Internet ou de votre site Web.

Ce service vous permettra de connaître la couleur d'un point en ligne sans télécharger ni installer de programmes supplémentaires. En travaillant sur notre service de pipette en ligne, vous pouvez connaître rapidement et facilement la couleur de n'importe quelle partie de l'image.

Pour ce faire, vous devez télécharger une photo sur le site. Pour télécharger le fichier, cliquez sur le bouton "Parcourir". Sélectionnez le fichier image souhaité et cliquez sur "Télécharger". Dès que l'image se charge, vous la verrez à l'écran. Ensuite, vous devez déplacer le curseur sur le pixel dont vous souhaitez déterminer la couleur. Dans une fenêtre séparée, vous pourrez voir la couleur du pixel et le champ Valeur actuelle affichera le numéro de pixel correspondant dans la couleur HTML et RVB du pixel.

Le service permet d'enregistrer le code couleur au format couleur HTML et RVB. Pour ce faire, vous devez déplacer le curseur sur le pixel souhaité et cliquer sur le bouton gauche de la souris. Dans le champ « Valeurs enregistrées » dans une fenêtre séparée, vous pouvez voir la couleur des pixels, ainsi que les valeurs de code de pixel enregistrées au format de couleur HTML et RVB.

Commentaires

Oui, ça a l'air bien, merci
Normale
chef-d'œuvre
poids
Nous vous avons beaucoup aidé, Loys
mob_info