📥 Instalación
Abrir Chrome Web Store
Ve a la página de TopApp Color Pro en Chrome Web Store
Añadir a Chrome
Haz clic en el botón "Añadir a Chrome" y confirma en el diálogo
Anclar a la barra
Clic en el icono de extensiones (🧩) → Pin en el icono de TopApp Color Pro para acceso rápido
¡Listo!
Ya puedes usar la extensión con Alt+C o haciendo clic en el icono
🎯 Selector de Color
🔍 Capturar color de pantalla
Usa el gotero nativo de Chrome para seleccionar cualquier color visible en tu pantalla (funciona en Chrome 95+)
📋 5 formatos disponibles
- HEX:
#3B82F6 - RGB:
rgb(59, 130, 246) - HSL:
hsl(217°, 91%, 60%) - HSV:
hsv(217°, 76%, 96%) - CMYK:
cmyk(76%, 47%, 0%, 4%)
💡 Tip: Configura tu formato preferido en "Al copiar usar"
🏷️ RAL Classic
Cada color muestra su equivalente RAL Classic más cercano de ~96 colores de la base de datos
♿ Contraste WCAG
Verifica la accesibilidad del color como texto sobre un fondo
- AA Normal: Ratio ≥4.5:1
- AA Grande: Ratio ≥3:1
- AAA Normal: Ratio ≥7:1
- AAA Grande: Ratio ≥4.5:1
🌐 Abrir en web
Abre el color actual en TopApp Color Pro web para análisis IA, gradientes, simulador de daltonismo, etc.
🕐 Historial automático
Los últimos 24 colores se guardan automáticamente
🎭 Generador de Paletas
Complementario
Colores opuestos en el círculo cromático
Análogo
Colores vecinos (juntos en el círculo)
Triádico
3 colores equidistantes
Tetrádico
4 colores en dos pares complementarios
Sombras
Tonos más oscuros del color base
Tintes
Tonos más claros del color base
Monocromático
Variaciones de luminosidad del mismo tono
Split Complementario
Color + 2 vecinos del complementario
De Página
¡NUEVO! Usa los colores extraídos de una web con sus porcentajes de uso
📝 Exportar CSS
Genera variables CSS listas para usar:
:root {
--color-1: #3B82F6;
--color-2: #10B981;
--color-3: #F59E0B;
--color-4: #EF4444;
--color-5: #8B5CF6;
}💡 Si es paleta de página, incluye porcentajes como comentarios
📄 Extractor de Colores de Página
🔎 Análisis automático
Escanea todos los elementos CSS de la página actual y extrae:
- Colores de fondo (
background-color) - Colores de texto (
color) - Colores de borde (
border-color)
📊 Ordenados por importancia
Los colores se muestran ordenados por frecuencia de uso, mostrando:
- Código HEX del color
- Equivalente RAL más cercano
- Porcentaje de uso en la página
🎨 Usar como paleta
Carga los colores extraídos como paleta en la pestaña Paletas con tipo "🌐 De Página"
🌐 Abrir en web
Envía la paleta extraída a TopApp Color Pro web con parámetro especial:
💾 Guardar paleta
Guarda la paleta de la página con un nombre personalizado en tus colecciones
📋 Copiar todo
Copia todos los colores con su frecuencia:
#3B82F6 (×142)
#FFFFFF (×98)
#1F2937 (×67)💾 Guardar y Colecciones
📁 Colecciones personalizadas
Guarda hasta 20 paletas con nombre personalizado desde la pestaña Paletas
🕐 Historial automático
Los últimos 24 colores seleccionados se guardan automáticamente
🎨 Reutilizar paletas
Clic en "Usar" para cargar una colección guardada en la pestaña Paletas
📋 Copiar colección
Copia todos los colores de una colección separados por coma
⌨️ Atajos de Teclado
Menú contextual
- 🎨 Abrir TopApp Color Pro: Abre la extensión
- 🌐 Abrir versión web completa: Abre la app web
💡 Tips y Trucos
Formato preferido
Configura tu formato de copia preferido en "Al copiar usar" para que todos los clics copien en ese formato
Análisis de páginas protegidas
El extractor de página no funciona en páginas internas de Chrome (chrome://) ni en Chrome Web Store
Paletas de página inteligentes
Los colores de página se ordenan por frecuencia de uso, mostrando primero los dominantes
RAL en paletas
Cada color de la paleta generada muestra su equivalente RAL debajo del código HEX
Tema oscuro/claro
Cambia entre tema claro y oscuro con el botón ☀️/🌙 en el header. Se guarda tu preferencia
Sincronización
El historial, colecciones y preferencias se guardan localmente en Chrome Storage
❓ Preguntas Frecuentes
¿Por qué el gotero no funciona?
El gotero requiere Chrome 95+ y la EyeDropper API. Actualiza Chrome si no lo ves. Como alternativa, usa el selector de color manual.
¿Puedo usar la extensión sin conexión?
Sí, toda la funcionalidad (selector, paletas, RAL, WCAG, extractor de página) funciona offline. Solo necesitas conexión para abrir la web completa.
¿Se guardan mis colecciones en la nube?
No, todo se guarda localmente en Chrome Storage. Si desinstalas la extensión o borras datos, se perderán.
¿Cuál es la diferencia con la app web?
La extensión es rápida y portable (selector de pantalla, extractor de página). La web tiene análisis IA, gradientes, simulador daltonismo, exportar PDF, etc.
¿Puedo exportar paletas como archivo?
Desde la extensión puedes copiar CSS. Para exportar en 10+ formatos (Figma, Tailwind, Swift, Android, etc.) usa la versión web.
¿Cómo actualizo la extensión?
Si está instalada manualmente, reemplaza los archivos y recarga en chrome://extensions/. Si está en Chrome Web Store, se actualiza automáticamente.