Siempre es beneficioso para la marca de todo emprendedor un lavado de cara o refrescamiento del diseño gráfico cada cierto tiempo, pero sin hacer cambios drásticos o extremos que confundan a los clientes. Un ejemplo de ello, es renovar la gama de colores utilizando otras tonalidades del color característico de tu marca.

¿Qué colores usar?

El color es una parte fundamental del diseño gráfico de tu web que influye de manera directa experiencia del usuario. Utilizar colores que sean compatibles con los colores de moda puede hacer que tu página web llame la atención a un público nuevo, aumentando la conversión a potenciales clientes.

Para que sea acertada la nueva gama de colores, debes saber qué significan y cómo influyen en la mente de las personas. Así, te explicaré brevemente qué trasmiten algunos colores, y en un próximo post hablaré sobre la psicología de los colores:

• Blanco: Limpieza, frescura y transparencia.
• Negro: formalidad, sobriedad y poder.
• Gris: minimalismo, paz y tenacidad.
• Amarillo: alegría, innovación y diversión.
• Azul: seriedad, progreso y fidelidad.
• Rojo: impulsividad, pasión y fuerza.
• Verde: crecimiento, estabilidad y equilibrio.
• Naranja: creatividad, éxito y calidez.
• Morado: elegancia, serenidad y eclecticismo.
• Rosa: amistad, dulzura y delicadeza.

Consejos para elegir tu gama de colores

Renovar el diseño gráfico de tu web debe ser un proceso estudiado y que responda al objetivo de transmitir a tus clientes que estás evolucionando y, sobre todo, acorde con las tendencias.

Al escoger las gamas a utilizar, debes tener presente tu público objetivo y conocer los colores que más le llamarían la atención. También, debes tener claro el mensaje que deseas transmitir. Intenta no utilizar demasiados colores, con el fin de mantener la web prolija y ordenada. Demasiados colores suelen dar una sensación de desorden y mal gusto.

En general, 3 colores son suficientes, siempre debe dominar uno sobre los otros dos, y dicho color debe ser colocado en los sitios de mayor interés en tu web, como por ejemplo en las llamadas a la acción, en los productos ganchos o en los formularios.

El mundo del color y diseño gráfico web es inmenso y, para los emprendedores, muchas veces desconocido, por lo que te daré las 5 herramientas que más uso en el momento de crearles la página web a mis clientes.

5 herramientas para elegir la gama de colores adecuada

Aprovecha el fin de semana para pensar en la gama de colores actuales de tu marca y qué te gustaría trasmitir luego de esa renovación. Una vez realizado el lavado de cara, planifica una campaña con el lanzamiento de la nueva imagen y así atraer nuevos clientes.

En el mercado hay cientos de herramientas para determinar la gama de colores de una página web, pero te describiré 5 que son fáciles de usar:

1.- Paletton:

Es un generador de paletas útil cuando ya se tiene un color seleccionado y necesitas un diseño basado en ese color. Colocas el color y automáticamente genera un circulo con variaciones de brillo y saturación.

También te muestra otros colores que combinan con el color base.  Esta herramienta te indica qué colores complementarios vendrían muy bien con el color principal.

Adicionalmente, al dar click en algún color del resultado te da el código hexadecimal de este y RGB  para usarlo en tu diseño web o en  Photoshop.

2.- Color Hex:

Esta herramienta, que cuenta con más de 50.000 paletas de colores, te puede ser de gran ayuda si no tienes un color definido y quieres inspirarte. Además, te da información de los colores, los análogos, complementarios y combinaciones de hasta 4 colores.

3.- Coolors:

Coolors me gusta mucho, sobre todo porque te permite ver paletas de colores creadas por otros usuarios. Con esta aplicación, puedes crear paletas con combinaciones de hasta 5 colores. Tiene varias secciones y funciones, pero las que más uso son: Generate y Explore.

En Generate puedes generar tu propia paleta de colores. Si tienes un único color elegido, lo introduces y el programa te generará el resto de la paleta. Si por el contrario no tienes un color y estás buscando el adecuado, aquí puedes ver las opciones e inspirarte en esas combinaciones (para generar colores nuevos solo debes darle a la barra espaciadora de tu ordenador).

Y si lo que quieres ver son las paletas generadas por otros usuarios debes ir al apartado Explore. Allí están ordenadas entre nuevas, las más votadas y selecciones.

4.- Adobe color:

El Adobe color es una de las herramientas más conocidas para generar paletas de colores interesantes. Su limitación es que debes tener ya un color definido, aunque tiene una opción para ver la paleta de colores de otros usuarios.

Tiene 4 formas de buscar la paleta de colores:

• Análogos (mismo color con menor o mayor degradación).
• Monocromáticos (mismo color con diferentes tonos).
• Tríada (3 colores distintos de los cuales dos son de tonalidades diferentes).
• Complementarios (colores visualmente compatibles con el color principal).
• Compuestos (5 colores complementarios al color principal).
• Personalizados (tú eliges todos los colores)

5.- HTML Color Codes:

Por ser el último no es el menos importante. De hecho, es la más completa de todas las herramientas descritas anteriormente.

Tiene todas las funciones del resto de las herramientas y puedes encontrar 8 maneras distintas de generar la paleta de colores: Colores complementarios, Tintas de color y Tonos de color, Triádicas, Análogas, Neutros, Tetrádicas, Neutros y Sombras de color.

Además, tiene recursos únicos en su web y que puedes utilizar, como lo son:

• Nombres: Obtienes los nombres que reciben los colores en formato HTML.
• Tablas: genera 3 tipos de tablas y los datos (HEX, RGB y HSL) de los colores escogidos.
• Tutoriales relacionados con los colores y elementos (HTML y CCSS).

Como lo puedes ver,  existen muchas herramientas para realizar el diseño y selección de paletas de color, pero con alguna de estas podrás crear tu gama propia, y con los consejos que encontrarás en mi post Diseño de páginas web y posicionamiento SEO 2018 tendrás éxito en el lanzamiento de tu web.

Cuéntame qué te pareció este artículo. ¿Te fue útil? ¿Necesitas que aborde otros temas?