Selector de color senzill

Selector de color gratuït per a Chrome

Trieu un color de qualsevol pàgina. Obteniu #E8553D

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.

La lupa quadrada sobre un cartell d'una pàgina web emmarca un píxel amb el seu HEX, RGB i HSL, al costat de la finestra de l'extensió Selector de color senzill amb #E8553D i un historial de colors

D'un cop d'ull

Què fa
Un comptagotes de color: apunteu a qualsevol píxel d'una pàgina web amb una lupa, feu clic i se'n copia el codi HEX, RGB o HSL.
Per a qui és
Per a desenvolupadors web i dissenyadors que fan coincidir colors de llocs en directe, maquetes i captures obertes al navegador, i per a qui necessiti un codi de color.
Preu
Gratuït. Sense compte ni versió de pagament.
Dades
El vostre historial i el format per defecte es queden a l'emmagatzematge local de l'extensió, al vostre dispositiu. Sense analítiques ni peticions de xarxa.
Funciona a
Chrome i altres navegadors Chromium que instal·len des de Chrome Web Store, en un ordinador. No a pàgines del navegador com la pestanya nova, la configuració o Chrome Web Store.
Límits
Tria de la part visible de la pestanya, amb una captura feta en començar. Sense CMYK, Pantone ni comprovació de contrast, i no es pot triar fora del navegador.
Versió
2.7.0, actualitzada el 23 d’octubre del 2026

Tres passos, un clic

  1. 1

    Inicieu el selector

    Feu clic a la icona de la barra d'eines i premeu Trieu un color, o premeu Alt+P a qualsevol pàgina.

  2. 2

    Apunteu amb la lupa

    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.

  3. 3

    Cliqueu i enganxeu

    El codi es copia en el format per defecte i un missatge breu ho confirma. Enganxeu-lo a CSS, Figma o un missatge.

Qui l'utilitza

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.

HEX

Disseny i comprovació de marca

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

Ajust de colors

Preneu HSL per ajustar a mà la lluminositat i la saturació, o RGB per a codi que vol números.

Què fa

  • píxel, emmarcat

    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.

  • formats

    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.

  • colors a l'historial

    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.

  • Drecera Alt+P

    Inicieu la selecció sense obrir la finestra. La tecla de la finestra obre la configuració de dreceres de Chrome si en voleu una altra.

  • peticions de xarxa

    Tot s'executa al vostre navegador. Sense compte, sense analítiques, sense telemetria.

  • Clar i fosc

    La finestra i la lupa segueixen el tema del sistema, en grisos neutres que no tenyeixen els colors que jutgeu.

Com obtenir el codi de color de qualsevol cosa d'una pàgina web

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.

Privat de disseny

  • Sense peticions de xarxa

    L'extensió no es comunica mai amb cap servidor. Sense analítiques ni telemetria.

  • Es queda al vostre dispositiu

    El vostre historial i el format per defecte són a l'emmagatzematge local de l'extensió.

  • Quatre permisos

    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 o Selector de color senzillComptagotes de DevToolsSelector de color senzill
Com començarObrir DevTools, trobar un color a Estils, fer clic a la mostra i després al comptagotesBotó de la barra d'eines o Alt+P
On va el resultatA la propietat CSS que heu obert; el copieu vosaltresAl porta-retalls, en fer clic
Formats de colorHEX, RGB, HSL i mésHEX, RGB i HSL
Colors triats abansNo es desenEls últims 50, a punt per copiar de nou
PreuIntegrat a ChromeGratuït

Preguntes

Com obtinc el codi de color d'un lloc web?

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.

Com trio un color d'una imatge d'una pàgina web?

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.

Puc copiar HSL o RGB en lloc de HEX?

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.

On trobo els colors que he triat abans?

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.

Com canvio la drecera Alt+P?

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.

Per què no funciona en algunes pàgines?

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.

Pot triar colors fora del navegador?

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? Recull dades?

És gratuït i no fa cap petició de xarxa. El vostre historial i el format per defecte es queden al vostre dispositiu.

Apunteu. Cliqueu. Enganxeu.