CSS
Treball de front-end
Traieu valors exactes d'un lloc en directe per a CSS, SCSS o una configuració de Tailwind sense obrir DevTools.
Selector de color gratuït per a Chrome
Selector de color senzill és un comptagotes gratuït per a Chrome. Premeu-ne el botó o Alt+P, apunteu a qualsevol píxel amb la lupa i feu clic: el codi HEX, RGB o HSL ja és al porta-retalls. Els últims 50 colors us esperen a la finestra emergent.
453 usuaris a Chrome Web Store
També funciona a Edge, Brave, Opera i altres navegadors basats en Chromium.

Feu clic a la icona de la barra d'eines i premeu Trieu un color, o premeu Alt+P a qualsevol pàgina.
Una lupa quadrada amplia l'entorn del cursor i emmarca el píxel exacte. Una etiqueta a sota mostra el HEX, RGB i HSL en directe.
El codi es copia en el format per defecte i un missatge breu ho confirma. Enganxeu-lo a CSS, Figma o un missatge.
CSS
Traieu valors exactes d'un lloc en directe per a CSS, SCSS o una configuració de Tailwind sense obrir DevTools.
HEX
Preneu una paleta d'una interfície, una maqueta o una referència, i comproveu que una pàgina fa servir el color de marca correcte.
HSL
Preneu HSL per ajustar a mà la lluminositat i la saturació, o RGB per a codi que vol números.
La lupa amplia 11 × 11 píxels al voltant del cursor i una retícula emmarca el que prendreu. Encerteu una vora d'un píxel o un sol graó d'un degradat.
HEX com #2A6FDB, RGB com rgb(42, 111, 219), HSL com hsl(217, 71%, 51%). Trieu el format per defecte una vegada a la finestra.
Cada color triat va al davant d'una graella dels últims 50 colors, sense duplicats. Feu clic en una mostra per veure i copiar els tres codis.
Inicieu la selecció sense obrir la finestra. La tecla de la finestra obre la configuració de dreceres de Chrome si en voleu una altra.
Tot s'executa al vostre navegador. Sense compte, sense analítiques, sense telemetria.
La finestra i la lupa segueixen el tema del sistema, en grisos neutres que no tenyeixen els colors que jutgeu.
El comptagotes de Chrome viu dins de DevTools: obriu el tauler Estils, trobeu una propietat de color, feu clic a la mostra i després al comptagotes. Funciona, però està amagat, i el valor triat substitueix aquesta propietat al CSS de la pàgina en lloc d'anar al porta-retalls.
Selector de color senzill us deixa un comptagotes a un clic o a una drecera. En començar, fa una captura de la part visible de la pestanya i hi obre a sobre una lupa quadrada, de manera que veieu el píxel exacte, no una mitjana. Un clic copia el codi, i la finestra el desa amb els últims 50 colors en els tres formats.
Desplaceu-vos fins a la part de la pàgina que necessiteu abans de començar: la lupa llegeix d'aquesta captura. Les pàgines del navegador, com la pestanya nova, la configuració i Chrome Web Store, estan tancades a totes les extensions.
L'extensió no es comunica mai amb cap servidor. Sense analítiques ni telemetria.
El vostre historial i el format per defecte són a l'emmagatzematge local de l'extensió.
La pestanya activa, només quan inicieu una selecció, per fer la captura; scripting per mostrar la lupa; emmagatzematge per a l'historial i el format; escriptura al porta-retalls per copiar el codi.
| Comptagotes de DevTools o Selector de color senzill | Comptagotes de DevTools | Selector de color senzill |
|---|---|---|
| Com començar | Obrir DevTools, trobar un color a Estils, fer clic a la mostra i després al comptagotes | Botó de la barra d'eines o Alt+P |
| On va el resultat | A la propietat CSS que heu obert; el copieu vosaltres | Al porta-retalls, en fer clic |
| Formats de color | HEX, RGB, HSL i més | HEX, RGB i HSL |
| Colors triats abans | No es desen | Els últims 50, a punt per copiar de nou |
| Preu | Integrat a Chrome | Gratuït |
Instal·leu Selector de color senzill, premeu Alt+P a la pàgina, apunteu la lupa al color i feu clic. El codi HEX, o RGB o HSL si ho preferiu, es copia al porta-retalls.
De la mateixa manera: inicieu el selector i feu clic al píxel que vulgueu de la imatge. La lupa amplia, així que podeu prendre un píxel exacte.
Sí. Trieu el format per defecte a la finestra: HEX, RGB o HSL. La finestra també mostra els tres per a qualsevol color de l'historial, cadascun amb el seu botó de còpia.
Obriu la finestra: els últims 50 colors hi són com a mostres, els més recents primer. Feu clic en una per veure i copiar-ne els codis, o esborreu l'historial.
Feu clic a la tecla de la drecera a la finestra. S'obre la pàgina de dreceres de teclat de Chrome, on podeu definir una altra tecla.
Chrome tanca les seves pròpies pàgines, com la pestanya nova, la configuració i Chrome Web Store, a totes les extensions. A més, el selector només llegeix la part visible de la pestanya, així que primer us heu de desplaçar fins al color.
No. Només tria de la pestanya actual del navegador. Tampoc no converteix a CMYK ni a Pantone ni comprova el contrast.
És gratuït i no fa cap petició de xarxa. El vostre historial i el format per defecte es queden al vostre dispositiu.