Sélecteur de Couleurs
Color Picker est un outil en ligne gratuit qui vous permet de sélectionner visuellement n'importe quelle couleur et d'obtenir ses valeurs exactes aux formats HEXADÉCIMAL, RVB, HSL, HSV et CMJN. Utilisez la boîte de saturation / luminosité intuitive combinée au curseur teinte pour identifier la couleur parfaite, ou entrez une valeur connue pour la voir s'afficher. L'outil affiche des aperçus en temps réel de la couleur sélectionnée, affiche des couleurs complémentaires et analogues et conserve un historique des couleurs récemment sélectionnées. Parfait pour les concepteurs, les développeurs et tous ceux qui ont besoin de valeurs de couleur précises pour la conception Web, l'art numérique, le développement d'interface utilisateur ou tout projet créatif.
Ce Qui Est
Le sélecteur de couleurs fournit une interface interactive pour sélectionner visuellement les couleurs plutôt que de vous demander de connaître des valeurs numériques spécifiques. C'est l'équivalent numérique d'une roue chromatique physique ou d'un outil d'échantillon de peinture. L'interface du sélecteur de couleurs se compose de: - Une boîte de saturation / valeur 2D: L'axe horizontal contrôle la saturation (du gris à la couleur pure), l'axe vertical contrôle la luminosité (du noir à la couleur) - Un curseur de teinte: Bande verticale ou horizontale montrant le spectre complet (0-360 degrés) - Un curseur opacité / alpha: Contrôle la transparence de 0 (invisible) à 1 (totalement opaque) - Champs de saisie: Saisie directe de valeurs HEXADÉCIMALES, RVB, HSL ou autres avec conversion automatique - Aperçu des couleurs: Grand échantillon montrant la couleur actuellement sélectionnée sur différents arrière-plans Comment utiliser chaque composant: - Cliquez/faites glisser dans la zone saturation / valeur pour choisir l'intensité et la luminosité de votre couleur - Faites glisser le curseur teinte pour sélectionner la famille de couleurs de base (rouge, orange, jaune, vert, bleu, violet) - Ajustez le curseur alpha pour les couleurs semi-transparentes - Tapez un code hexadécimal directement dans l'entrée HEXADÉCIMALE pour une spécification exacte - Cliquez sur n'importe quelle valeur pour la copier dans le presse-papiers Relations de couleur affichées: - Couleur complémentaire (opposée sur la roue chromatique) - Split-couleurs complémentaires - Couleurs analogues (teintes adjacentes) - Couleurs triadiques (régulièrement espacées) Fonction d'historique: L'outil enregistre automatiquement vos 10 dernières couleurs sélectionnées dans le stockage du navigateur, vous permettant de revoir les sélections précédentes sans les sélectionner à nouveau. Ceci est particulièrement utile lorsque vous comparez plusieurs couleurs entre les sessions.
Comment utiliser
- Utilisez la zone Saturation/valeur 2D pour sélectionner votre couleur. Déplacez-vous horizontalement pour régler la saturation (du gris atténué aux couleurs vives) et verticalement pour régler la luminosité (de l'obscurité à la lumière). Un indicateur en croix indique votre position actuelle.
- Faites glisser le curseur teinte (bande arc-en-ciel à droite) pour sélectionner la teinte de base. Cela modifie toute la famille de couleurs affichée dans la zone saturation / valeur. Cliquez directement sur n'importe quelle teinte pour y accéder instantanément.
- Affinez la couleur sélectionnée à l'aide des champs de saisie. Entrez directement un code hexadécimal si vous le connaissez précisément, ou ajustez les valeurs RVB/HSL individuelles à l'aide des entrées numériques et des touches fléchées pour un contrôle précis.
- Ajustez le curseur alpha/transparence si vous avez besoin d'une couleur semi-transparente. L'arrière-plan en damier derrière l'aperçu montre visuellement la transparence. Les sorties RGBA et HEXADÉCIMALES à 8 chiffres sont mises à jour pour refléter la valeur alpha.
- Affichez les couleurs complémentaires, analogues et triadiques générées automatiquement sous le sélecteur. Cliquez sur n'importe quelle couleur générée pour la sélectionner comme couleur active pour l'édition ou la copie.
- Choisissez votre couleur dans l'historique si vous en avez récemment utilisé une. Les 10 dernières couleurs sont enregistrées dans le stockage du navigateur pour un accès facile. Cliquez sur n'importe quel échantillon d'historique pour le sélectionner à nouveau.
- Copiez la valeur de couleur sélectionnée dans votre format préféré à l'aide des boutons de copie à côté de chaque format (HEXA, RVB, HSL). La valeur copiée va directement dans votre presse-papiers pour être collée dans CSS, des outils de conception ou du code.
Exemples
Entrée: Position de l'écran: x = 450, y=320
Processus: Read pixel → RGB extraction → HEX conversion
Résultat: SORTILÈGE: # 2563EB / RVB(37, 99, 235)
Entrée: Couleur naturelle: Sélectionnez le bleu ciel de l'image
Processus: Image sampling → Average pixel color
Résultat: SORTILÈGE: # 87CEEB / RVB(135, 206, 235)
Recherches Connexes
Les gens recherchent aussi : sélecteur de couleurs, sélecteur de couleur, roue chromatique, sélecteur de couleur.
sélecteur de couleurssélecteur de couleurroue chromatiquesélecteur de couleur
Questions Fréquemment Posées
Comment choisir une couleur hexadécimale spécifique que je connais déjà?
Tapez ou collez simplement le code hexadécimal dans le champ de saisie HEXADÉCIMAL. Il sera analysé et affiché instantanément dans le sélecteur. Pour les codes hexadécimaux à 8 chiffres (avec alpha), utilisez l'entrée ou le type RGBA incluant la partie alpha (#RRGGBBAA). Le sélecteur met à jour automatiquement toutes les autres valeurs de format et la sélection visuelle.
Puis-je utiliser le sélecteur de couleurs avec mon logiciel de conception comme Figma ou Sketch?
Oui. Choisissez une couleur à l'aide de l'outil et copiez la valeur hexadécimale ou RGBA, puis collez-la directement dans Figma, Sketch, Adobe XD ou tout logiciel de conception acceptant les valeurs hexadécimales/RVB. Pour Esquisser, collez-le dans le champ hexadécimal du sélecteur de couleurs. Pour Figma, collez-le dans l'entrée hexadécimale du panneau de conception. Les valeurs RVB et HSL peuvent également être utilisées si votre flux de travail préfère ces formats.
Qu'est-ce que le HSV et en quoi diffère-t-il du HSL?
HSV (Teinte, Saturation, Valeur) et HSL (Teinte, Saturation, Luminosité) sont tous deux des modèles de couleurs cylindriques mais diffèrent dans la façon dont ils définissent la luminosité. Dans HSV, la valeur contrôle la luminosité de la couleur à saturation complète. Dans HSL, la luminosité contrôle le milieu entre le noir et le blanc. Les teintes pures apparaissent à V=100% dans HSV mais à L=50% dans HSL. HSL est généralement plus intuitif pour créer des teintes claires (augmenter L) ou des nuances sombres (diminuer L). L'outil affiche les deux pour la compatibilité avec différents flux de travail.
Le sélecteur de couleurs fonctionne-t-il avec les couleurs de l'écran (pipette)?
L'outil fonctionne avec la pipette système si votre navigateur prend en charge l'API de la pipette. Cliquez sur l'icône pipette et votre curseur se transforme en loupe—cliquez sur n'importe quel pixel de votre écran pour échantillonner sa couleur. Cela capture les couleurs de n'importe quelle application, page Web ou élément de bureau. Si votre navigateur ne prend pas en charge l'API pipette, vous pouvez utiliser des applications tierces de sélection de couleurs d'écran et saisir manuellement la valeur hexadécimale.
Pourquoi mes couleurs sont-elles différentes à l'écran et à l'impression?
Les couleurs affichées à l'écran utilisent RVB (rouge, clair, bleu clair), tandis que l'impression utilise CMJN (encre Cyan, Magenta, jaune, noire). Ces espaces colorimétriques ont des gammes différentes—certaines couleurs d'écran lumineuses n'ont pas d'équivalent CMJN exact. L'outil fournit des valeurs CMJN à titre de référence, mais pour des couleurs d'impression précises, utilisez les valeurs du système de correspondance Pantone ou consultez les profils de couleurs de votre imprimante. La luminosité de l'écran, l'étalonnage du moniteur et l'éclairage ambiant affectent également l'apparence des couleurs sur différents appareils.