CRX id
nehjikgeimnnhanmobkkfjlnnklgmneo
nehjikgeimnnhanmobkkfjlnnklgmneo
Description from extension meta
Toma cualquier color de píxel de cualquier página web y copia su código HEX al instante.
Image from store
Description from store
La precisión del color es el hilo conductor de cada interfaz atractiva, activo de marca, panel de visualización de datos y campaña de marketing. Sin embargo, los diseñadores e ingenieros front-end siguen perdiendo incontables minutos analizando códigos hexadecimales en las herramientas de desarrollo o capturando una página solo para muestrearla en Photoshop. Eye Drop Tool, una extensión ligera del navegador basada en Manifest V3, convierte esa fricción en un único y elegante gesto: haz clic en el icono de la barra de herramientas, selecciona cualquier píxel en la ventana gráfica y el valor preciso #RRGGBB se copia al portapapeles. Un sutil brindis confirma la acción y vuelves al trabajo sin interrumpir tu flujo.
Por qué es importante esta extensión
Los selectores de color nativos del navegador existen desde hace años, pero la mayoría están ocultos en el inspector, limitados a elementos del DOM o ocultos tras submenús con botón derecho. La herramienta Gota de Ojo ofrece la misma potencia en un botón siempre presente que funciona con cualquier elemento que renderice su monitor: imágenes, lienzos, fotogramas de vídeo, SVG e incluso plugins de terceros.
Características destacadas
Activación con un solo clic: sin ventanas emergentes ni paneles de configuración. Un serviceworker en segundo plano inyecta el script de contenido del selector al instante, manteniendo la sobrecarga de memoria prácticamente a cero cuando está inactivo.
Muestreo de píxeles universal: debido a que la extensión captura el búfer de pantalla en lugar del árbol DOM, funciona en escenas WebGL renderizadas dinámicamente, juegos y videos transmitidos tan bien como en HTML estático.
Copia instantánea del portapapeles: la cadena HEX se escribe en el portapapeles automáticamente; puedes pegarla directamente en Figma, VS Code o Slack sin un diálogo intermedio.
Notificación de confirmación visual: una microinteracción en la esquina de la página (“#ffcc33 copiado!”) le asegura que la acción se realizó correctamente y desaparece después de 1,5 segundos.
Beneficios para el usuario
Ahorro de tiempo: elimine la necesidad de recurrir a herramientas de desarrollo o aplicaciones externas. Durante un sprint de diseño, esos segundos se convierten en horas.
Carga cognitiva reducida: permanecer en el mismo contexto mental mantiene el flujo creativo; no estás haciendo malabarismos con ventanas ni cambiando el enfoque.
Coherencia perfecta en píxeles: verifique rápidamente que el código de producción coincida con la guía de estilo de la marca o que las maquetas de marketing cumplan con las relaciones de contraste de accesibilidad.
Prevención de errores: escribir códigos hexadecimales manualmente invita a errores tipográficos; copiar al portapapeles elimina ese riesgo, lo que genera confirmaciones más limpias y menos informes de errores.
Grupos de usuarios objetivo
Diseñadores de UI/UX
Muestrear rápidamente colores de prototipos vivos para reutilizarlos en sistemas de diseño
Ajuste de tonos durante una sesión de revisión de Figma
Desarrolladores front-end
Validar que las variables CSS se representen correctamente en diferentes estados
Coloque el cursor sobre un botón en la etapa de prueba y tome su color activo
Ingenieros de control de calidad
Confirmar las relaciones de contraste WCAG y el cumplimiento de la marca
Durante las pruebas de regresión, compare la compilación de producción con la especificación
Comercializadores digitales y creadores de contenido
Adaptar gráficos ad hoc a la paleta del sitio web
Tira del banner azul del héroe para obtener un mosaico social de último momento.