Choisissez une couleur, copiez le code, avancez
Sélecteur de couleur, générateur de dégradés et pipette d'image sur une seule page. Sans compte, sans installation et sans attente : choisissez un ton et copiez-le en HEX, RGB, HSL ou HSV.
Codes couleur
#0F37FFrgb(15, 55, 255)hsl(230°, 100%, 52.94%)hsv(230°, 94.12%, 100%)cmyk(94.12%, 78.43%, 0%, 0%)xyz(19.61, 10.05, 95.5)lab(37.93, 62.96, -98.45)lch(37.93, 116.86, 302.6°)Couleurs tendance
Voir toutes les couleurs tendanceCe qu'il contient
Pipette
Prélevez des couleurs dans une image importée, ou n'importe où à l'écran si votre navigateur le permet. Déposez un fichier et cliquez sur un pixel.
Conversion de formats
Passez instantanément entre HEX, RGB, HSL, HSV, CMYK, XYZ, LAB et LCH, et copiez la valeur directement dans votre CSS ou votre outil de design.
Générateur de dégradés
Ajoutez et déplacez des arrêts sur la barre, basculez entre linéaire et radial, réglez l'angle et l'opacité, puis copiez le CSS final.
Historique des couleurs
Chaque couleur et chaque dégradé est conservé dans votre navigateur, pour y revenir plus tard ou le réutiliser dans un autre projet.
Harmonies et variations
Chaque page couleur affiche teintes, ombres et six schémas d'harmonie, et transforme n'importe lequel en dégradé en un clic.
Gratuit et privé
Aucun péage et aucun suivi de ce que vous choisissez. Les images importées sont lues dans le navigateur et ne partent nulle part.
À qui il s'adresse
- Designers et équipes produit
- Pour esquisser une interface ou une palette de marque, explorer des combinaisons et copier le CSS exact d'un dégradé.
- Illustration et arts
- Pour prélever dans des photographies et des peintures avec la pipette, et planifier des ombrages doux.
- Développement front-end
- Pour produire des valeurs cohérentes dans un projet et relire celles d'une maquette existante.
- Contrôle d'accessibilité
- Pour comparer une couleur entre modèles et l'ajuster jusqu'à ce que le rapport de contraste passe le seuil visé.
Comment l'utiliser
- 1
Choisissez une couleur
Cliquez dans le champ de saturation, puis affinez avec les curseurs de teinte et d'alpha. HEX, RGB et HSV se mettent à jour au fur et à mesure.
- 2
Prélevez dans une image
Glissez une image sur la page ou choisissez un fichier, puis cliquez sur le pixel voulu. Les codes apparaissent aussitôt.
- 3
Construisez un dégradé
Cliquez sur la barre pour ajouter un arrêt et faites-le glisser. Basculez entre linéaire et radial, puis réglez l'angle.
- 4
Copiez et réutilisez
Copiez la valeur ou la déclaration CSS complète. Tout ce que vous choisissez est enregistré automatiquement.
Questions fréquentes
Un petit outil qui ne gêne pas
Tout a commencé comme un utilitaire interne : nous voulions saisir une couleur, l'ajuster et continuer, sans ouvrir d'abord un logiciel de design lourd. C'est volontairement une seule page, volontairement rapide, et cela restera gratuit.
Extensions de navigateur
Vous préférez prélever les couleurs directement sur les pages que vous visitez ? Les extensions Chrome et Edge ajoutent une pipette à votre barre d'outils, gardent leur propre historique et ouvrent cet outil en un clic.