Selector de Color
Selecciona colores, extráelos de imágenes locales, genera paletas, comprueba el contraste y crea gradientes CSS. Compatible con HEX, RGB(A), HSL(A), HSV y CMYK.
Extracción de Color de Imagen
Arrastra una imagen o haz clic para subir
Colores Dominantes
Agrega colores a tu paleta
Texto de muestra en tamaño normal (14px)
Texto Grande de Muestra
Relación de Contraste
21:1
AA Texto normal
Pasa
AA Grande
Pasa
AAA Texto normal
Pasa
AAA Grande
Pasa
90°
Cuándo Usar Este Selector de Color
Nuestro selector de color gratuito ayuda a diseñadores y desarrolladores a trabajar con colores:
-
Diseño Web
Selecciona colores perfectos para sitios web y verifica relaciones de contraste para cumplir con accesibilidad.
-
Identidad de Marca
Crea paletas de colores armoniosas para logos, materiales de marketing y guías de marca.
-
Coincidencia de Color de Imagen
Extrae colores de fotos para combinar elementos de diseño con imágenes existentes.
-
Desarrollo CSS
Genera gradientes CSS y exporta paletas de colores como propiedades personalizadas CSS.
-
Pruebas de Accesibilidad
Verifica que las combinaciones de texto y fondo cumplan con los estándares WCAG AA y AAA.
Preguntas frecuentes del Selector de color
- ¿Cómo uso el selector de color?
- Elige un color con el cuadrado y los deslizadores o introduce directamente un formato compatible. Usa las pestañas para armonías, tu paleta personalizada, el contraste y los gradientes CSS.
- ¿Qué formatos de color son compatibles?
- El selector acepta entrada HEX, RGB(A), HSL(A), HSV y CMYK y mantiene sincronizados esos campos.
- ¿El selector de color guarda o envía mis datos?
- El trabajo principal con el color se queda en tu navegador. Los colores de la paleta personalizada se guardan en el almacenamiento local de este navegador hasta que los limpies, las imágenes subidas se procesan localmente y los análisis estándar del sitio pueden seguir cargándose en las páginas de producción de AppDoesIt.
- ¿Por qué veo un error o no se actualiza nada?
- Comprueba que el valor sea un color HEX, RGB(A), HSL(A), HSV o CMYK válido. La extracción desde imágenes también necesita un archivo compatible y las entradas de contraste esperan colores HEX.
- ¿Puedo copiar o exportar colores?
- Sí. Puedes copiar valores individuales, exportar la paleta personalizada como CSS o JSON y copiar el CSS del gradiente generado.
Cómo Usar el Selector de Color
Primeros Pasos
- Haz clic y arrastra en el cuadrado de color para seleccionar saturación y brillo
- Usa el deslizador de tono para cambiar el color base
- Ajusta la opacidad con el deslizador alfa si es necesario
- Copia cualquier formato, guarda el color actual en tu paleta o cambia de pestaña para usar contraste y gradientes
Características
- Selector de color interactivo con vista previa en tiempo real
- Extrae colores de cualquier imagen con el gotero
- Genera combinaciones de colores armoniosas automáticamente
- Crea paletas personalizadas y exporta como CSS o JSON
- Verifica el contraste de color WCAG para accesibilidad
- Crea gradientes CSS con el editor visual
Atajos de Teclado
- Ctrl/Cmd + C: Copiar el color HEX actual
- Ctrl/Cmd + V: Pegar y aplicar un color del portapapeles
- 1-4: Cambiar entre pestañas de características
Consejos
- Sube una imagen para extraer sus colores dominantes localmente en tu navegador.
- Usa el verificador de contraste para asegurar la legibilidad del texto
- Tu paleta personalizada se guarda en este navegador hasta que la limpies.
Privacidad y almacenamiento
- La selección de color, la conversión de formatos, las comprobaciones de contraste y las vistas previas de gradientes se ejecutan en tu navegador.
- Los colores de la paleta personalizada se guardan en el almacenamiento local del navegador de este dispositivo hasta que los elimines.
- Las imágenes subidas se procesan localmente en tu navegador y el acceso al portapapeles solo se usa cuando activas copiar o pegar.
- Los análisis estándar del sitio pueden seguir cargándose en las páginas de producción de AppDoesIt.