CSS Color Picker
Date de publication : mars 2016
Le sélecteur de couleurs CSS vous permet d'insérer des valeurs de couleur dans les propriétés de couleur CSS. Il inclut une palette standard de couleurs et utilise des noms de couleurs standards, les codes de hachage, les valeurs de couleur RGB, RGBA, HSL et HSLA, et affiche une liste des couleurs récemment utilisées. Par défaut, le sélecteur de couleurs écrit des valeurs hexadécimales. Pour modifier ce paramètre, consultez Format, CSS, Éditeur de texte, boîte de dialogue Options.
Choisir une couleur
Le sélecteur de couleurs a une barre de couleurs et un écran couleur. La barre de couleurs est toujours accessible en premier.
Pour afficher la barre de couleurs
Tapez une propriété CSS qui prend une valeur de couleur (par exemple, color:, rgb(, rgba(, hsl(, hsla( ou #).
Pour accéder à la barre de couleurs avec le clavier, placez le curseur sur une couleur existante dans la feuille de style et appuyez sur Ctrl-J ou Ctrl-Espace.
Dans une feuille de style vide, la barre de couleurs affiche une palette par défaut. Dans une feuille de style avec des couleurs existantes, la barre de couleurs affiche une liste des couleurs récemment utilisées.
Pour choisir une couleur dans la barre de couleurs
Cliquez sur l'une des couleurs dans la barre de couleurs, ou appuyez sur la flèche bas pour accéder à la barre de couleurs, puis utilisez les touches de direction gauche et droite pour sélectionner une couleur.
Sur la feuille de style, les valeurs de propriété changent lorsque vous sélectionnez différentes couleurs.
Pour afficher plus de couleurs, cliquez sur la flèche gauche et droite de la barre de couleurs, ou utilisez les touches de direction pour vous déplacer à gauche et droite sur la barre de couleurs.
Appuyez sur Entrée pour assigner la couleur choisie à la propriété de couleur CSS.
Pour choisir une couleur personnalisée dans l'écran couleur
Pour afficher l'écran couleur, choisissez le signe plus (+) à l'extrémité droite de la barre de couleurs, ou appuyez sur la touche Bas une fois lorsque la barre de couleurs est visible.
Effectuez une ou plusieurs des opérations suivantes :
Utilisez la souris pour sélectionner une couleur de l'écran.
Modifiez la couleur en déplaçant le curseur à droite vers le haut ou vers le bas.
Modifiez l'opacité en déplaçant le curseur à gauche ou à droite vers le bas. Les valeurs sont écrites au format RGBA ou HSLA.
Choisissez Sélectionner pour remplacer le pointeur par un outil pipette. La couleur choisie est visualisée à mesure que vous déplacez le pointeur.
Lorsque vous modifiez des couleurs avec l'une de ces méthodes, la couleur d'origine s'affiche dans la zone Original, la couleur choisie apparaît dans la zone Nouveau, et la valeur de la propriété couleur CSS est prévisualisée sur la feuille de style.
Appuyez sur Entrée pour assigner la couleur choisie à la propriété de couleur CSS.
Notes
La couleur choisie est affichée à l'aide des paramètres d'affichage de votre moniteur et peut être différente dans un autre moniteur.
Éléments de l'interface utilisateur
Liste UIElement
Nouveau
Affiche la couleur sélectionnée dans la boîte de dialogue qui n'a pas encore été assignée à la règle CSS.D'origine
Affiche la couleur assignée à la règle CSS.Opacité
Faites glisser le bouton vers la droite pour augmenter l'opacité de la couleur, ou vers la gauche pour la diminuer.Notes
Étant donné qu'il n'y a aucune représentation d'opacité au format hexadécimal standard, le sélecteur de couleurs écrira les valeurs RGBA ou HSLA lorsque vous ajustez l'opacité.
Pick
Remplace le pointeur par un outil pipette qui permet de sélectionner n'importe quelle couleur apparaissant à l'écran pour l'assigner à une propriété CSS. Lorsque vous déplacez le pointeur sur l'écran, la couleur correspondant à l'emplacement du pointeur est prévisualisée dans la zone Nouveau, et une valeur de la propriété couleur CSS appropriée est modifiée sur la feuille de style.