CSS
Travail front-end
Relevez des valeurs exactes sur un site en ligne pour du CSS, du SCSS ou une config Tailwind, sans ouvrir DevTools.
Pipette de couleur gratuite pour Chrome
Prélevez une couleur sur n'importe quelle page. Obtenez #E8553D
Pipette de couleur est une pipette gratuite pour Chrome. Appuyez sur son bouton ou sur Alt+P, visez un pixel avec la loupe et cliquez : le code HEX, RGB ou HSL est déjà dans le presse-papiers. Vos 50 dernières couleurs vous attendent dans la fenêtre de l'extension.
453 utilisateurs sur le Chrome Web Store
Fonctionne aussi dans Edge, Brave, Opera et les autres navigateurs Chromium.
En bref
- Ce que ça fait
- Une pipette de couleur : visez un pixel d'une page web avec la loupe, cliquez, et son code HEX, RGB ou HSL est copié.
- Pour qui
- Les développeurs web et les designers qui relèvent des couleurs sur des sites en ligne, des maquettes et des captures ouvertes dans le navigateur, et toute personne qui a besoin d'un code couleur.
- Prix
- Gratuit. Sans compte, sans version payante.
- Données
- Votre historique et le format par défaut restent dans le stockage local de l'extension, sur votre appareil. Pas d'analyse, pas de requêtes réseau.
- Compatibilité
- Chrome et les autres navigateurs Chromium qui installent depuis le Chrome Web Store, sur ordinateur. Pas sur les pages du navigateur comme la page Nouvel onglet, les paramètres ou le Chrome Web Store.
- Limites
- Prélève dans la partie visible de l'onglet, à partir d'une capture faite au démarrage. Pas de CMYK, de Pantone ni de contraste, et pas de prélèvement hors du navigateur.
- Version
- 2.7.0, mise à jour le 23 octobre 2026
Trois étapes, un clic
- 1
Lancez la pipette
Cliquez sur l'icône de la barre d'outils puis sur Choisir une couleur, ou appuyez sur Alt+P sur n'importe quelle page.
- 2
Visez avec la loupe
Une loupe carrée zoome autour du curseur et cadre le pixel exact. Une pastille dessous affiche le HEX, le RGB et le HSL en direct.
- 3
Cliquez et collez
Le code est copié dans votre format par défaut et une courte note le confirme. Collez-le dans du CSS, dans Figma ou dans un message.
Qui l'utilise
HEX
Design et contrôle de marque
Prélevez une palette sur une interface, une maquette ou une référence, et vérifiez qu'une page utilise la bonne couleur de marque.
HSL
Ajuster les couleurs
Prenez le HSL pour régler à la main la luminosité et la saturation, ou le RGB pour du code qui veut des nombres.
Ce que ça fait
pixel, cadré
La loupe agrandit 11 × 11 pixels autour du curseur et un réticule cadre celui que vous allez prendre. Visez une bordure d'un pixel ou une seule marche d'un dégradé.
formats
HEX comme #2A6FDB, RGB comme rgb(42, 111, 219), HSL comme hsl(217, 71%, 51%). Choisissez le format par défaut une fois dans la fenêtre.
couleurs dans l'historique
Chaque prélèvement passe en tête d'une grille de vos 50 dernières couleurs, sans doublons. Cliquez sur un échantillon pour voir et copier les trois codes.
Raccourci Alt+P
Lancez la pipette sans ouvrir la fenêtre. La touche affichée dans la fenêtre ouvre les raccourcis de Chrome si vous voulez une autre touche.
requête réseau
Tout se passe dans votre navigateur. Sans compte, sans analyse, sans télémétrie.
Clair et sombre
La fenêtre et la loupe suivent le thème du système, en gris neutres qui ne teintent pas les couleurs que vous jugez.
Trouver le code couleur de n'importe quoi sur une page
La pipette de Chrome se cache dans DevTools : ouvrez le panneau Styles, trouvez une propriété de couleur, cliquez sur son échantillon, puis sur la pipette. Ça marche, mais c'est enfoui, et la valeur choisie remplace cette propriété dans le CSS de la page au lieu d'arriver dans le presse-papiers.
Pipette de couleur place une pipette à un clic ou à un raccourci. Au démarrage, elle fait une capture de la partie visible de l'onglet et ouvre une loupe carrée dessus : vous voyez le pixel exact, pas une moyenne. Un clic copie le code, et la fenêtre le garde avec vos 50 dernières couleurs, dans les trois formats.
Faites défiler jusqu'à la zone voulue avant de démarrer : la loupe lit cette capture. Les pages du navigateur, comme Nouvel onglet, les paramètres et le Chrome Web Store, sont fermées à toutes les extensions.
Confidentialité par conception
Aucune requête réseau
L'extension ne parle jamais à un serveur. Pas d'analyse, pas de télémétrie.
Reste sur votre appareil
Votre historique et le format par défaut sont dans le stockage local de l'extension.
Quatre autorisations
L'onglet actif, seulement quand vous lancez un prélèvement, pour faire la capture ; scripting pour afficher la loupe ; storage pour l'historique et le format ; écriture dans le presse-papiers pour copier le code.
Pipette DevTools ou Pipette de couleur
| Pipette DevTools ou Pipette de couleur | Pipette DevTools | Pipette de couleur |
|---|---|---|
| Pour démarrer | Ouvrir DevTools, trouver une couleur dans Styles, cliquer sur son échantillon, puis sur la pipette | Bouton de la barre d'outils ou Alt+P |
| Où va le résultat | Dans la propriété CSS ouverte ; vous la copiez vous-même | Dans le presse-papiers, au clic |
| Formats de couleur | HEX, RGB, HSL et plus | HEX, RGB et HSL |
| Couleurs prélevées avant | Non conservées | Vos 50 dernières, à copier de nouveau |
| Prix | Intégrée à Chrome | Gratuit |
Questions
Comment obtenir le code couleur d'un site web ?
Installez Pipette de couleur, appuyez sur Alt+P sur la page, visez la couleur avec la loupe et cliquez. Le code HEX, ou RGB ou HSL si vous préférez, est copié dans le presse-papiers.
Comment prélever une couleur dans une image d'une page web ?
De la même façon : lancez la pipette et cliquez sur le pixel voulu dans l'image. La loupe zoome, vous prenez donc un pixel exact.
Puis-je copier du HSL ou du RGB plutôt que du HEX ?
Oui. Choisissez le format par défaut dans la fenêtre : HEX, RGB ou HSL. La fenêtre affiche aussi les trois pour chaque couleur de l'historique, chacun avec son bouton de copie.
Où retrouver les couleurs prélevées plus tôt ?
Ouvrez la fenêtre : vos 50 dernières couleurs y sont en échantillons, les plus récentes d'abord. Cliquez sur l'une pour voir et copier ses codes, ou effacez l'historique.
Comment changer le raccourci Alt+P ?
Cliquez sur la touche du raccourci dans la fenêtre. Elle ouvre la page des raccourcis clavier de Chrome, où vous pouvez choisir une autre touche.
Pourquoi ça ne marche pas sur certaines pages ?
Chrome ferme ses propres pages, comme Nouvel onglet, les paramètres et le Chrome Web Store, à toutes les extensions. La pipette ne lit aussi que la partie visible de l'onglet : faites d'abord défiler jusqu'à la couleur.
Peut-elle prélever des couleurs hors du navigateur ?
Non. Elle prélève uniquement dans l'onglet courant du navigateur. Elle ne convertit pas non plus en CMYK ou en Pantone et ne vérifie pas le contraste.
Est-ce gratuit ? Collecte-t-elle des données ?
C'est gratuit et sans requête réseau. Votre historique et le format par défaut restent sur votre appareil.
Plus d'extensions gratuites de PYROCTAL
Capture d'écran pleine pageCapture d'écran pleine page en un clic ou raccourci clavier : capture défilante d'une page ou application web, enregistrée en PNG.
FontLensQuelle police ? Clic droit pour savoir. Inspecteur pour copier CSS, Tailwind/SCSS, tester les modifs et vérifier le contraste.
YouTube Qualité AutoRéglez automatiquement la qualité vidéo préférée sur YouTube — HD, 4K, 1080p, choisissez la résolution par défaut
Enregistrer l'image en JPEGEnregistrez n'importe quelle image en JPG d'un clic droit : WebP, PNG, AVIF, GIF, SVG et autres formats convertis en photo standard.