¿Como elegir los colores de mi aplicación o sitio web?

Gerson Lázaro


Uno de los aspectos fundamentales para una adecuada interacción de los usuarios con tu sitio o aplicación es la correcta elección de los colores. No basta con que a ti te parezcan bonitos. Es necesario crear una armonía entre el diseño y el color, con tonalidades apropiadas tanto para el publico objetivo, como para la temática de la app, y no menos importante, que el color de toda la aplicación sea consistente con la marca.

Así que antes de iniciar un diseño, es imprescindible tener preestablecida una paleta de colores que te permita lograr los resultados esperados. A continuación, una serie de herramientas web que serán de ayuda para crear nuestra paleta de colores:

Adobe Color CC (Antes Adobe Kuler)

https://color.adobe.com/es/ Adobe Color Una herramienta imprescindible para trabajar paletas de colores. Te permite crear tus propias paletas (que puedes guardar en la plataforma sin costo alguno) además de ver una galería de las creadas por otros usuarios. Puedes también descargar las paletas como archivo .ASE (Adobe Swatch Exchange) para usar en Illustrator.

Entrando en detalle, tienes un circulo cromático, del cual puedes editar o modificar los colores. No importa si trabajas con RGB, CMYK, LAB, HSB o formato hexadecimal, todos podrás trabajarlos en Adobe Color.

Además esta herramienta maneja conceptos de la teoría del color, con los cuales podrás experimentar para crear tu paleta. Cuando utilizas uno de los siguientes conceptos, das consistencia y armonía a la paleta, además de ser muy fácil de utilizar:

  • Colores Monocromáticos: Los colores monocromáticos tienen el mismo tinte pero diferente saturación y matiz.
  • Colores Análogos: Colores “vecinos” en el circulo cromático
  • Colores en Triada: Colores que se encuentran a 120 grados en el circulo cromático.
  • Colores Complementarios: Colores que se encuentran a 180 grados en el circulo cromático, y por lo tanto son totalmente opuestos.

Sin duda, es una de las mas completas herramientas.

Flat UI Colors

http://flatuicolors.com/ Flat UI Colors Mucho mas minimalista que la anterior. Simplemente te da una cuadricula con 20 colores que se copian al portapapeles solo pulsando sobre ellos. ¿Por qué la recomiendo? Simple: Maneja colores Flat, los cuales son tendencia y sin importar como los combinas, siempre logras un bonito resultado. No dejes de probarlo.

Paletton

http://paletton.com/ Paletton Con una utilidad similar a Adobe Color CC, pero con una manera de trabajar totalmente distinta. En muchos aspectos es también mas completa que la de Adobe, pero todo hay que decirlo, menos intuitiva.

Colllor

http://colllor.com/ Es posiblemente la mas sencilla de todas, lo cual complementa perfectamente con su gran utilidad. Eliges un color (incluso puedes dejarlo aleatorio) y te genera una serie de paletas de colores que podrás utilizar sin problema.

Cymbolism

http://cymbolism.com/ Esta es radicalmente diferente a las anteriores: Aquí buscamos asociar colores con palabras que denoten situaciones y/o expresiones. ¿Necesitas una paleta que denote tranquilidad? ¿Amor? ¿Alegría? Esta es tu herramienta.

Vhue

http://vhue.co Vhue Al igual que la anterior relaciona colores con palabras, pero también con imágenes. Buscas una palabra (por ejemplo “sky”, cielo) y la app te muestra imágenes relacionadas con el cielo, junto a la paleta de colores de cada imagen. Simplifica el trabajo.

Color Blender

http://colorblender.com/ Usando 3 sencillos deslizadores creas tus paletas de colores al instante.

Bonus: Colores Google Material

Google Material Google Material Aunque propiamente no es una herramienta sino la colección de colores que Google Utiliza y recomienda para la ultima versión de su sistema móvil Android, sin duda es una maravillosa colección.

Yo personalmente me quedo con Adobe Color y Flat UI. ¿Y tu? ¿Conoces alguna herramienta similar?