Firefox: cómo reconocer un color en particular en una página web

Si eres diseñador, probablemente prestes atención al diseño de las cosas que vistes, buscando inspiración o ideas que te gustaría adoptar. El uso del color no es uno de los componentes clave del diseño de un sitio web. Si encuentra un sitio web que es el color perfecto para su proyecto en el que está trabajando o pensando, probablemente quiera saber de qué color es. Si bien puede tomar una foto, abrirla en un editor de imágenes y luego ver los valores RGB, este proceso es lento. Firefox en realidad tiene un selector de color incorporado, por lo que puede ahorrar tiempo y obtener el valor exacto en el formato de color HTML hexadecimal utilizado en la web.

Cómo utilizar el selector de color

El selector de color de Firefox se encuentra en la barra de herramientas del desarrollador. Para acceder a él, haga clic en el icono del menú de hamburguesas en la esquina superior derecha, luego haga clic en «Desarrollador Web», que es el cuarto en la parte inferior.


Haga clic en el icono del menú de hamburguesa en la esquina superior derecha, luego haga clic en «Desarrollador web».

En la lista de herramientas de desarrollo web, haga clic en «Pipetear» y se abrirá la herramienta Cuentagotas.

Consejo: el cuentagotas no se puede mover entre pestañas o ventanas, así que asegúrese de abrirlo en la pestaña donde desea usarlo. Tampoco podrá desplazarse por la página, así que asegúrese de estar en el lugar correcto de la página. Si bien es técnicamente posible acercar y alejar el zoom, esto hará que el selector de color rompa el centrado, lo que hará que sea mucho más difícil de usar con precisión.


En la lista de herramientas de desarrollo web, seleccione «Pipeta».

La herramienta Cuentagotas rastreará el mouse a través de la ventana, así que mueva el cuadrado resaltado en el medio al color que desea seleccionar. El nivel de zoom es lo suficientemente preciso como para que pueda ver y seleccionar fácilmente un color de píxel en particular.

El código de color HTML del píxel aparece en el cuadro pequeño debajo de la herramienta de zoom, pero también se copiará en el portapapeles si hace clic en el color que desee. Tenga en cuenta que al hacer clic en el selector de color se cierra, lo que le obliga a volver a abrirlo si desea seleccionar más colores.


Mueva el mouse a los píxeles específicos que desee, luego ingrese el código de color HTML o haga clic para copiarlo al portapapeles.