Comparadas · revisadas el 2026-10-25
Las mejores herramientas gratis de paletas y contraste
Una herramienta de paletas debería encontrar colores en una imagen, crear armonías a partir de un color, comprobar que el texto se lee bien y pasar la paleta a tus herramientas de diseño o de código. Esto es lo que ofrece cada una, según sus propias páginas.
Hacemos Slop Colors, una de las herramientas de esta página. Cada dato sobre las demás herramientas procede de sus propias páginas, enlazadas bajo cada una, tal como se leían el 2026-10-25. Los precios y las funciones cambian: revisa cada sitio antes de elegir.
Cómo las comparamos
- Gratis, y qué añade una cuenta o un plan
- Colores de una imagen
- Armonías y escalas a partir de un color
- Comprobación de contraste WCAG
- Archivos de exportación (CSS, Tailwind, ASE, GPL)
De un vistazo
| Herramienta | Precio | Funciona en | Colores de una imagen | Comprobación de contraste |
|---|---|---|---|---|
| Slop Colors la nuestra | Gratis, sin cuenta | Cualquier navegador actual | Cuentagotas y colores principales (k-means) | Proporción, AA y AAA, con una corrección |
| Coolors | Plan gratis; plan Pro | Web, app para iOS, complemento de Figma, extensión de Chrome | Image Picker | Contrast Checker |
| Adobe Color | Gratis | Web | Extraer de una imagen | Proporciones de contraste con orientación WCAG |
| WebAIM Contrast Checker | Gratis | Web | No (un cuentagotas toma el color de la pantalla) | AA y AAA, texto normal y grande, interfaz |
| Función | Slop Colors la nuestra | Coolors | Adobe Color | WebAIM Contrast Checker |
|---|---|---|---|---|
| Colores de una imagen | Sí | Sí | Sí | No |
| Armonías a partir de un color | Sí | No indicado | Sí | No |
| Comprobación de contraste WCAG | Sí | Sí | Sí | Sí |
| Niveles para texto grande e interfaz | Sí | No indicado | No indicado | Sí |
| Vista previa de daltonismo | No | No indicado | Sí | No |
| Exportar CSS | Sí | Sí | No indicado | No |
| Exportar Tailwind | Sí | Sí | No indicado | No |
| Exportar .ase de Adobe | Sí | Sí | No indicado | No |
| Exportar .gpl de GIMP | Sí | No indicado | No indicado | No |
| Valores OKLCH | Sí | No indicado | No indicado | No |
| No hace falta cuenta | Sí | En parte | En parte | Sí |
| Las imágenes se quedan en tu dispositivo | Sí | No indicado | No indicado | Sí |
1. Slop Colors (la nuestra)
Ideal para: Tomar colores de tus propias imágenes en privado, comprobar el contraste y exportar una paleta como código o archivo de muestras, todo en una página.
Lo bueno
- Las imágenes se leen en el navegador, nunca se suben
- Variables CSS, configuración de Tailwind, JSON y exportaciones .ase de Adobe y .gpl de GIMP, y esos archivos se vuelven a abrir
- HEX, RGB, HSL, OKLCH y CMYK, con los OKLCH fuera de gama convertidos a sRGB
Lo menos bueno
- No hay una biblioteca de paletas compartidas donde buscar
- No hay vista previa de daltonismo
- No se puede exportar la paleta en PDF ni en imagen
2. Coolors
Ideal para: Generar y explorar paletas rápido, con una gran biblioteca y complementos para herramientas de diseño.
Lo bueno
- Generador con la barra espaciadora y más de 10 millones de paletas para explorar
- Exporta a PDF, imagen, CSS, ASE, SVG, código y Tailwind
- Palette Visualizer muestra los colores aplicados a diseños
Lo menos bueno
- El plan gratis guarda hasta 10 paletas; su página incluye la extracción de colores con Image Picker y la exportación avanzada entre las funciones Pro
Sitio web de Coolors · Fuentes: Página principal de Coolors
3. Adobe Color
Ideal para: Diseñadores de las apps de Adobe que quieren reglas de armonía sobre una rueda de color y paletas guardadas en su biblioteca.
Lo bueno
- Reglas monocromática, complementaria, análoga, triádica y complementaria dividida sobre una rueda de color
- Vista previa de daltonismo
- Guarda las paletas en tu biblioteca para otros proyectos
Lo menos bueno
- Su página de la rueda de color no menciona los archivos de exportación
Sitio web de Adobe Color · Fuentes: Adobe Color, rueda de color
4. WebAIM Contrast Checker
Ideal para: Comprobar un par de texto y fondo según WCAG, con un enlace para compartir el resultado.
Lo bueno
- Deslizadores de luminosidad para ajustar cualquiera de los dos colores
- Enlace permanente y una API JSON para el resultado
- Transparencia para el texto
Lo menos bueno
- Comprueba un solo par; no crea ni exporta paletas
Sitio web de WebAIM Contrast Checker · Fuentes: WebAIM Contrast Checker
Cuál elegir
Slop Colors es nuestra elección cuando los colores vienen de tus propias imágenes y la paleta tiene que acabar en código o en una herramienta de diseño: el cuentagotas, los colores principales, la comprobación de contraste y las exportaciones están en una sola página, y no se sube nada.
Elige Coolors por su generador, su biblioteca y sus complementos, Adobe Color por su rueda de color y su biblioteca de Adobe, y el comprobador de WebAIM para revisar y compartir un único par.
Preguntas
¿Qué proporción de contraste necesito?
WCAG AA pide 4,5:1 para texto normal y 3:1 para texto grande y elementos de la interfaz; AAA pide 7:1 y 4,5:1. Las cuatro herramientas muestran la proporción.
¿Qué archivo se abre en Photoshop o Illustrator?
Un archivo Adobe Swatch Exchange (.ase). Slop Colors y Coolors exportan los dos.
¿Se sube mi imagen?
No en Slop Colors: se lee en tu navegador. Consulta las notas de privacidad de cada una de las otras herramientas.
Los nombres de otros productos son marcas de sus propietarios. Slopographic no está afiliada a ellos.