introducción-paleta-de-colores-sitio web

¿Sabías que ciertos colores hacen que las personas escuchen y respondan de diferentes maneras?

¿Se siente abrumado por la cantidad de posibles paletas de colores en su sitio web? ¿No estás seguro de cuál elegir?

Todos tienen sus colores favoritos.

Pero un diseñador experimentado comprende la importancia de evaluar un esquema de color basado en la marca. Los significados de los colores. Y los productos o servicios promocionados.

Los colores en realidad provocan respuestas emocionales según la paleta que uses.

Las buenas opciones de color requieren una planificación cuidadosa.

Pueden afectar la forma en que un visitante interpreta lo que ven tanto como la apariencia del sitio y, si se hacen correctamente, pueden tener un impacto positivo en la evaluación de cada visitante de la marca en su conjunto.

En este artículo, veremos por qué es importante seleccionar los colores adecuados para su sitio, así como 23 paletas de colores diferentes de sitios reales que son eficaces para captar la atención de los visitantes.

¿Por qué es tan importante tu combinación de colores?

Antes de comenzar el proceso de selección de una combinación de colores para su sitio, es importante comprender exactamente por qué la combinación de colores de su sitio es tan importante.

Después de todo, puede pensar que el contenido es realmente importante. Y eso es cierto, pero eso no es todo.

A la gente le gusta el contenido. Se sienten atraídos por nuevos rumores e información interesante, pero primero debes llamar su atención. Aquí es donde entran en juego las paletas de colores de los sitios web.

Consejos rápidos para el episodio 4 de CRO Shots

Si elige el esquema de color correcto para el sitio web, tendrá la oportunidad de mejorar drásticamente la experiencia del visitante con su contenido.

Así es como:

1. Crea reconocimiento de marca

Su sitio web es esencialmente el hogar de su negocio en línea.

Esto significa que debe ser una representación precisa de su marca y, más allá de eso, debe ser lo suficientemente memorable para que los usuarios regresen después de su primera visita.

Después de todo, muchos de sus visitantes no estarán listos para realizar una compra o conversión importante en su primera visita y deben recordar su negocio para regresar y tomar esas medidas.

Afortunadamente, el color aumenta el reconocimiento de la marca en un 80%.

Por lo tanto, si su empresa ya tiene un esquema de color establecido, es esencial incluirlo en el diseño de su sitio, ya que esto hará que sea mucho más fácil para los visitantes conectarse instantáneamente con otros lugares donde han visto su marca.

Además, si el esquema de color es consistente en todo el sitio, sabrán que han venido al lugar correcto cuando regresen, sin importar en qué página exacta lleguen.

Además de decirles a los usuarios quién es su empresa, su diseño web también juega un papel importante en los juicios rápidos de los usuarios sobre su marca.

Según una encuesta, el 94% de los encuestados indicó que el diseño web es un factor de control importante primeras impresiones del sitio web.

Por supuesto, el diseño web implica mucho más que solo color.

Pero dado que el color es uno de los elementos más obvios de su sitio y una de las únicas cosas que un usuario puede discernir en esos primeros 50 milisegundos, su paleta puede hacer o deshacer la calificación del usuario de su empresa.

2. Modele cómo se sienten los visitantes acerca de su sitio.

En otro estudio sobre cómo se forman las primeras impresiones de los consumidores, 90 por ciento de las calificaciones iniciales se basa únicamente en el color.

Hasta cierto punto, la razón de esto es clara.

Después de todo, el color es uno de los aspectos más simples de una página «comprensible». Se puede calificar casi instantáneamente y no requiere que los visitantes califiquen la copia u otros mensajes.

Pero también es importante considerar el papel que juega psicología del color jugar en estos juicios rápidos.

Muchas empresas aprovechan estas conexiones, como ilustran logotipos en el siguiente gráfico.

sitios-paleta-de-colores-2-logotipos-en-el-siguiente-diagrama

Por ejemplo, las marcas que quieren crear un sentido de creatividad e imaginación tienden a incorporar el púrpura en las imágenes, mientras que las marcas que quieren establecer un sentido de equilibrio y calma tienden a utilizar el blanco y negro.

Esto está directamente relacionado con la «personalidad» que desea que tenga su marca.

En un estudio sobre la personalidad de la marca, la psicóloga y profesora de Stanford Jennifer Aaker concluyó que cinco dimensiones fundamentales juegan un papel en la personalidad de la marca:

sitio-paleta-color-estudio-personalidad-marca

Las marcas a veces pueden combinar características, pero en su mayor parte su «personalidad» se centra principalmente en una. Una empresa que vende equipo para acampar, por ejemplo, se identificaría con «resistencia», mientras que una marca de moda podría apuntar a la «sofisticación».

Y, como puede ver en la tabla de logotipos de arriba, el color puede jugar un papel importante al mostrarles a los consumidores cómo es la personalidad de su marca.

Si bien es posible que la mayoría no se dé cuenta conscientemente de que el logotipo rojo de una empresa está diseñado para crear una sensación de emoción, aún puede hacerlo.

Y aunque cada color puede servir para crear una sensación o reacción específica, algunos colores son mejores opciones que otros para la mayoría de las marcas y sitios web.

Por ejemplo, el azul a menudo se considera la opción más segura. Esto se debe en parte al hecho de que es el color «favorito» más común entre la mayoría de la población.

De hecho, el 57% de los hombres y el 35% de las mujeres dicen que es su color favorito.

sitios-colores-paletas-azul-color-favorito

Entonces, si desea atraer a una gran audiencia, esta podría ser una excelente opción para su sitio, de hecho, esta podría ser la razón por la cual algunos de los sitios más visitados hoy en día, como Facebook y Twitter, lo usan para sus logotipos y marcas.

También vale la pena señalar que el azul también se asocia a menudo con sentimientos de confianza, autoridad y confiabilidad.

Pero eso no significa que sea la mejor opción para todos los sitios. Todo depende del sentimiento que quieras transmitir a tus visitantes.

Por ejemplo, si su marca se enfoca en la salud y el bienestar, el verde podría ser una mejor opción para hacer esa asociación. Y si quiere deleitar a sus visitantes y hacer que actúen rápidamente, el rojo podría ser más efectivo porque te ayudó a lograrlo.

Por lo tanto, al seleccionar colores para su sitio, considere las reacciones emocionales que podría traer a sus visitantes.

Por ejemplo, si está buscando crear una sensación de paz para el sitio web de su estudio de yoga, es posible que el rojo no sea la mejor opción, y es mejor saberlo antes de invertir dinero.

3. Desarrolle un sentido de orden

Además de las respuestas emocionales que pueden evocar los colores individuales que elija, también debe considerar cómo los colores de su sitio interactúan entre sí.

La mejor manera de hacer esto es observar algunos principios básicos de teoría del color.

sitio web-paletas-de-colores-teoría-de-3-colores

Si alguna vez tomó una clase de arte o analizó recursos relacionados con el diseño, probablemente haya visto algo como la rueda de colores en la tabla de arriba.

El concepto más común ilustrado en esta rueda es la relación entre los colores primarios (rojo, amarillo y azul) y los colores secundarios y terciarios que se forman al mezclarlos.

Pero más allá de eso, esta rueda puede ayudarlo a crear una armonía de colores o una disposición de colores visualmente agradable. Una paleta de diseño web armoniosa puede ayudar a establecer una sensación de equilibrio y orden.

Hay tres tipos de esquemas de color ampliamente aceptados que se pueden utilizar para establecer este tipo de armonía: analógico, monocromático y complementario.

Un esquema de color analógico consta de colores que caen uno al lado del otro en la rueda de colores. Esta es una de las paletas más difíciles de hacer bien, porque los colores pueden abrumarse fácilmente entre sí.

Dicho esto, los esquemas de colores analógicos también son algunos de los más vibrantes.

Entonces, si desea crear un sitio colorido y visualmente interesante, puede hacerlo bien con una paleta similar a siguiendo tres ejemplos:

sitios-paleta-de-colores-3-ejemplo-1

Un esquema de color monocromático cae en el extremo opuesto del espectro del tipo anterior. Como sugiere el nombre, consta de un solo color principal, pero la intensidad y el brillo de los tonos varían.

Estas paletas son algunas de las más fáciles de crear y «más seguras» de implementar, ya que los distintos tonos del mismo color rara vez chocan o se sienten demasiado ocupados.

Entonces, si desea un aspecto relativamente simple en su sitio, un esquema de color monocromático como estos tres podría funcionar bien para su marca:

sitios-paleta-de-colores-3-ejemplo-2

Finalmente, una paleta complementaria se encuentra en algún lugar entre esquemas analógicos y monocromáticos en términos de variedad.

Se compone de colores que están directamente opuestos entre sí en la rueda de colores. Entonces, si bien involucra diferentes colores, esos colores se complementan entre sí de forma natural y no abrumarán a los visitantes.

Si desea incluir variedad en la combinación de colores sin hacer que el sitio esté demasiado ocupado, una combinación de colores complementaria como uno de ellos podría ser la elección perfecta:

sitios-paleta-de-colores-3-ejemplo-3

Por supuesto, estos tres no son los únicos tipos de combinaciones de colores que puede crear. De hecho, los mejores tipos de palets varían según a quién solicites.

A esquema de color triádico es una de las principales opciones.

paletas-de-colores-del-sitio-web-tríadas-esquema-de-colores

Este esquema de color implica el uso de tres colores que están a 120 grados entre sí en la rueda de colores. En la tabla anterior, esos colores son naranja, verde y morado.

Al seleccionar colores, tenga en cuenta que los tipos enumerados anteriormente no son reglas definitivas. Estos pueden darle una idea general de la sensación general de su sitio, pero de ninguna manera son las únicas formas de crear una paleta que funcione para su marca.

Independientemente del tipo de paleta que utilice, puede utilizarla para crear una jerarquía del contenido más importante de cada página.

4. Destacar ciertos elementos

Como se mencionó en la sección anterior, una paleta de colores definida de los sitios puede ser útil para indicar que ciertos elementos son importantes.

Puede maximizar este impacto manteniendo Efecto aislante mientras decide cómo utilizar la combinación de colores en sus páginas.

La idea general detrás de este principio psicológico es que cuanto más se destaca un elemento, es más probable que se observe y se recuerde.

Asegúrese de que los colores que elija le brinden la capacidad de realizar ciertas llamadas a la acción en sus páginas sin entrar en conflicto con el resto del diseño.

Mapas de calor y mapas de desplazamiento de Crazy Egg

Este enfoque también está en consonancia con las preferencias de la mayoría de los consumidores.

En dos estudios, La respuesta estética a las combinaciones de colores. Y Preferencias de los consumidores por los esquemas de color, los investigadores encontraron que aunque los consumidores prefieren combinaciones de colores con tonos similares, también prefieren paletas con un color de acento muy contrastante.

El primer estudio mostró que «la preferencia y armonía de las parejas aumenta tanto como aumenta la similitud de matices». Pero, «aunque los pares con tonos muy contrastantes generalmente no se consideran ni preferibles ni armoniosos, los valores de preferencia del color figurativo aumentan a medida que aumenta el contraste del tono con el fondo».

En el segundo estudio, los investigadores encontraron que «a las personas generalmente les gusta combinar colores que son relativamente parecidos o que coinciden exactamente, excepto que algunas personas resaltan un componente característico del producto mediante el uso de colores contrastantes».

Entonces, si bien el color de su acento debe tener un fuerte contraste, está bien, e incluso es preferible, si el resto de su paleta se compone de tonos relativamente similares.

Esto significa que crear paletas de diseño web que incluyan colores fuertes y llamativos no solo es eficaz para aislar ciertos elementos, sino que también es una excelente manera de crear una combinación que muchos de sus visitantes desearán.

5. Simplifique sus decisiones de diseño

Cuando se trata de administrar un sitio web o un negocio (¡o ambos!), Siempre es una buena idea buscar formas de simplificar los conceptos básicos.

Después de todo, cuanto menos tiempo dedique a las tareas básicas, más tiempo tendrá que dedicar a los procesos y decisiones que tienen un mayor impacto en su éxito.

Y configurar paletas de diseño web es una excelente manera de reducir el tiempo que lleva crear nuevas páginas. Cuando tiene un esquema de color establecido, hace que las elecciones de diseño básicas sean mucho más fáciles, tanto para usted como para sus diseñadores y desarrolladores.

Esto es especialmente cierto si se toma el tiempo para documentar su paleta de una manera fácil de usar. como este negocio:

paletas-de-colores-del-sitio-simplifica-las-decisiones-de-diseño

Cuando cree un documento de paleta fácil de usar, cree un activo de un vistazo con todas las opciones posibles para cada elemento.

De esa manera, si usted (o sus diseñadores) tienen problemas para determinar qué color usar para un botón de CTA, simplemente puede consultar el documento para obtener una lista completa de sus opciones.

Entonces, en lugar de desarrollar su cerebro para todas las posibilidades, puede elegir de una lista de colores predefinida. Y una vez que haya seleccionado algunos para usar o probar, todos los códigos HEX y RGB ya están frente a usted.

¿Cuántos colores deberías incorporar?

Todo depende de la complejidad de su diseño y de los tipos de combinaciones de colores. Por ejemplo, si está utilizando una paleta de diseño web monocromática, es posible que necesite siete o incluso más tonos de ese color para capturar suficiente variedad en la pantalla.

Deberá especificar colores para ciertas partes de su sitio, como texto, fondos, enlaces, colores flotantes, botones de CTA y títulos.

Cómo elegir un esquema de color para sitios web

Si no está seguro de cómo seleccionar las mejores paletas de colores para su diseño web, vea este video que creamos. Lo guía a través de consejos prácticos para elegir un esquema de color para su sitio web.

Idealmente, las paletas de colores del sitio web reflejan los valores, las creencias y el propósito de una empresa. Los colores fuertes pueden indicar un ambiente menos formal y más emoción, mientras que los colores modestos dan una nota más sofisticada o formal a la actividad.

Pero esto no siempre es fácil de traducir cuando se analizan miles de posibles combinaciones de colores. Echemos un vistazo a 23 excelentes paletas de colores para sitios web que pueden ayudarlo a aumentar la participación.

16 paletas de colores excelentes para sitios web para mejorar el compromiso (2020)

Los siguientes sitios utilizan diferentes paletas de colores de sitios web para lograr un gran efecto. Se eligen cuidadosamente por las emociones que evocan y las sensaciones que transmiten.

1. Mi copa

sitio-paletas-colores-mea-cuppa

los Mi taza el sitio web utiliza una paleta de colores agradable, incorporando algunos tonos de joyas (rubí y esmeralda) para una máxima vitalidad, pero por lo demás se basa en una paleta neutra, monocromática, marrón y gris.

site-color-palette-mea-cuppa-palette

La paleta de diseño web evoca la atmósfera de un café y se refleja en la imagen del héroe del sitio, lo que crea cohesión.

2. Toldo

sitios-paleta-de-colores-carpa-grande

BigTop es una comunidad especializada en dar soporte a la red de startups. El sitio utiliza una combinación inusual pero extremadamente atractiva de tonos de joyería, que van desde el púrpura y el azul hasta el naranja y el amarillo brillantes.

paletas de colores-web-site-palette-web-bigtop

Los colores primarios son todos colores fríos, lo que hace que los colores parezcan más cálidos. Notarás en la captura de pantalla de la página de inicio que la CTA naranja y amarilla captan tu atención en primer lugar.

3. El ojo de Tori

sitio-paleta-colores-toris-ojos

El tercer ejemplo proviene del visor de Twitter Eye de Tori. Este es un excelente ejemplo de un esquema predominantemente de color. monocromo. Aquí vemos los efectos de una paleta de colores simple pero fuerte, centrada en tonos de verde.

paletas de colores-site-palis-ochi-toris

Este esquema de color suele ser fácil de dibujar, ya que un tono de un color casi siempre funcionará con otro tono del mismo color.

4. BarkBox

sitios-paleta-de-colores-barkbox

El color dominante es el rosa brillante. BarkBox la página de inicio se repite en todo el sitio en diferentes tonos. Contrasta muy bien con el color azul utilizado en los logotipos y CTA en todo el sitio.

paletas de colores-sitio web-barkbox-palette

El uso de colores complementarios para llamar la atención de los visitantes donde lo desee puede ayudar a mejorar la paleta de colores de cualquier sitio web.

5. Kit de supervivencia de queso

sitio-web-queso-paleta-colores-kit-de-supervivencia

El rojo es un color extremadamente popular para la paleta de colores de un sitio web. Puede transmitir una rica mezcla de emociones, lo que lo hace muy versátil. Es particularmente fuerte cuando se usa en pequeñas dosis, como puede ver arriba. Set de supervivencia de queso sitio web.

Paleta-de-queso-supervivencia-kit-paleta-de-colores-sitio

El rojo está templado con colores más neutros y el azul ayuda a empacar para las llamadas a la acción y otras áreas donde la empresa quiere captar la atención del visitante.

6. Northern Ruby

Paleta-de-color-rubí-nórdico

Rubí nórdico, una conferencia en Estocolmo, tiene un hermoso sitio diseñado en ricos tonos joya. Los colores elegidos para esta paleta de colores del sitio le dan refinamiento y lo diferencian de los diseños menos impactantes.

paletas de colores-web-site-palette-ruby-nordic

7. Lake Nona

lago-noveno-sitio-paleta-de-colores

Lago de Nona es un sitio web para un lugar determinado, más precisamente cerca del agua. En consecuencia, no es sorprendente ver un color azul representado aquí. Los otros colores neutros hacen que el azul se destaque bien.

paletas-de-colores-del-sitio-lago-nona-paleta

8. Soporte de limón

paletas-de-color-limón

Una vez más, no es de extrañar que una empresa llamada Soporte de limón tendría amarillo en la paleta de colores del sitio web. El azul y el gris se combinan a la perfección con el amarillo y ayudan a atenuar su brillo.

sitio-paleta-colores-paleta-limonada

9. Menta

sitios-colores-paletas-menta

menta es un sitio dedicado a la financiación, por lo que el uso de verde y azul son buenas opciones. Ayudan a transmitir calma, tranquilidad y confianza. Los tonos neutros de la familia de los marrones la convierten en una paleta de colores terrosos que calma los sentidos.

paletas-sitio-paleta-de-colores-menta-paleta

10. Odopod

paletas-de-colores-del-sitio-odopod

Odópodo va con la paleta de colores monótona, pero ayuda a evitar el aspecto aburrido con un degradado en su página de inicio. La letra grande ofrece un gran contraste y es obvio dónde desea hacer clic.

paletas de colores-sitio-web-paleta-odopod

11. Fiverr

sitios-paleta-de-colores-cinco

Puede notar que muchas empresas reservan un color específico, por si acaso Fiverr, verde: exclusivamente para llamadas a la acción. No aparece en ningún otro lugar del sitio. De hecho, ColorFav ni siquiera se hizo cargo de él, ya que está dominado por colores más neutros.

paletas-sitio-paleta-de-colores-cinco

12. Escuela de fotografía digital

página-web-paleta-colores-escuela-fotografía

Es de esperar que una empresa de artes gráficas tenga una paleta de colores impresionante para su sitio web, y la Escuela de Fotografía Digital no defrauda. Los colores brillantes ayudan a atraer al espectador. Y, como Fiverr, la naranja utilizada en el CTA ni siquiera aparece en la paleta del sitio porque es fácil de usar para generar impacto.

paletas-de-colores-paletas-de-paletas-de-paletas-de-paletas-de-colores

13. Ahrefs

sitios-paleta-de-colores-ahrefs

paletas de colores-paleta-sitio-web-ahrefs

Ahrefs es un ejemplo de un sitio web que utiliza su paleta de colores libremente. Un azul más oscuro actúa como el color dominante, pero existen variaciones en todo el sitio. Lo mismo ocurre con el naranja, el rosa y el verde azulado.

14. Millo.co

sitios-paleta-de-colores-millo

Millo.co use una paleta de colores muy simple de sitios web y es lo mejor para ella. Sabemos exactamente dónde buscar cuando visitamos un sitio como este.

sitios-paleta-de-colores-milo-palette

15. Brian Gardner

sitios-paleta-de-colores-brian-gardner

Algunas empresas y particulares llevan la paleta de colores monocromáticos al extremo. Brian Gardner, diseñador web, utiliza una combinación de colores en blanco y negro que funciona a la perfección. Se basa en su marca de minimalismo, por lo que refleja sus valores y creencias.

paletas de colores-sitio-web-paleta-brian-gardner

16. Avance

paletas-de-colores-del-sitio-web

Los colores suaves pueden funcionar bien cuando desea tranquilizar al visitante. Chasis use dosis generosas de salmón y azul. Funciona bien, especialmente con el color azul más oscuro disponible para CTA y otros elementos importantes de la página.

paletas de colores-sitio web-paletas-web-telas

Una lista práctica de recursos para elegir la paleta de colores perfecta para su sitio web

Aquí hay 18 recursos de paleta de colores para configurar la paleta perfecta para su sitio web.

Primero, ¿necesitas inspiración?

1: Colores de la marca

Colores del sitio BrandColors

BrandColors le muestra cómo las mejores marcas utilizan el color para diferenciar su negocio, contar sus historias de marca y explicar a los clientes lo que representan. Puede desplazarse alfabéticamente por una lista de empresas, organizaciones sin fines de lucro y nuevas empresas, o puede buscar por nombre de marca.

¿Estás buscando una paleta lista para usar?

2: ColorLovers

comparte tus ideas e inspiración de color

ColourLovers es un sitio de foro de diseño de paleta, con casi 2 millones de paletas enviadas por sus usuarios. Puede buscar «paletas que incluyan este color», puede navegar o seguir a los diseñadores. A menudo encontrará variaciones de la misma paleta, lo que le brinda opciones de tono y saturación listas para usar.

Paleta ColorLovers

(Completo con nombres caprichosos).

3: Rueda de color

de colores

ColoRotate viene con una biblioteca de esquemas de color que puede explorar, seleccionar y editar. Si desea crear uno desde cero, puede hacerlo con una herramienta de color 3D. Y puede utilizar el diseño que creó directamente en PhotoShop o Fireworks, con Complemento ColorRotate Y aplicación para iPad.

Haga coincidir su marca

Pero, ¿qué pasa si ya tiene imágenes, logotipos o marcas en qué colores debe encajar su sitio web?

4: Cazador de color

Cazador de color

Color Hunter no es una herramienta con una amplia gama de características como algunos de los paneles de control todo en uno de esta lista. En cambio, es una solución sólida para una cosa: perseguir un determinado color. Vaya al sitio, luego inserte una imagen y la herramienta creará una paleta para usted a partir de la imagen. Esta es una excelente manera de crear paletas de colores alrededor de las imágenes con las que necesita armonizar su sitio, y puede usarla para revertir las paletas de sitios que desee.

5: Imágenes

Pictaculos

Pictaculous genera paletas de colores a partir de fotos: cargue una foto y Pictaculous sugerirá colores para combinar. Además de proporcionarle una paleta basada en la foto que cargue, Pictaculous proporcionará esquemas de color listos para usar que combinan.

Estas herramientas generarán paletas a todo color.

6: Rueda de color Adobe Color CC

Rueda de color Adobe Color CC

Esta herramienta se conocía como Adobe Kuler y comenzó como un sitio de comparación de colores básico. Ahora, es un sistema de construcción de paleta de colores con la máxima potencia. Le permite probar, comparar y guardar combinaciones de colores basadas en una esfera de colores. Puede elegir tipos de paleta y generar paletas en cinco colores con diferentes niveles de entrada en la herramienta, incluidos los totalmente personalizados y casi automáticos.

7: Paletton

Paletton

Paletton le permite crear rápidamente una paleta de colores. Seleccione el esquema deseado: mono, complementario, triádico, tetrádico, analógico o analógico acentuado. Entonces, cuando cambia un color en el esquema, los otros cambian para coincidir.

8: Aguja de color

Aguja de color

Color Spire te crea una paleta de colores de un solo color. Seleccione un color inicial y Color Spire sugiere una paleta de colores para usar en combinación con él. También proporciona una vista previa, lo que le permite ver cómo se ven los colores que recomienda en un ejemplo de sitio web.

9: esfera de color MudCube

Esfera de color MudCube

(Fuente: http://htmlcolorcodes.com/resources/best-color-palette-generators/)

Color Sphere de MudCube es un complemento de Chrome que te ayuda a armonizar colores, controlar el daltonismo e identificar códigos hexadecimales. También puede exportar esquemas de color directamente a Illustrator, PhotoShop y CoIRD.com.

10: Colores cohesivos

Colores cohesivos

Cohesive Colors toma su paleta actual y le permite manipularla, agregando un tono de recubrimiento en el color deseado y generando una nueva paleta a partir de una existente de manera rápida y sencilla.

11: Generador de esquema de color hexagonal

Generador de esquema de color hexagonal

Esta herramienta le permite generar colores que funcionan en conjunto con un color que ya posee. Es un poco más simple que algunas de las herramientas de esferas de color de esta lista. Pegue un número hexadecimal en la herramienta o haga clic en la rueda de colores y vuelva con un conjunto de 3 colores adicionales a juego, completos con códigos hexadecimales.

Construye tus colores

Algunas de estas herramientas requieren que tengas un color en mente para empezar. Si no tienes la marca, tienes que adaptarte y BrandColors no te mostró nada que te llamara la atención, puedes empezar de cero.

12: Aplicación de color

Aplicación de color

Esta herramienta de iOS le permite tomar decisiones precisas entre colores similares colocándolos claramente con algo de espacio entre ellos, en lugar de en degradados, como ruedas de color y esferas. Las grandes cuadrículas de colores le permiten usar la pantalla completa (¡usuarios de iPad Pro, disfruten!) Y también le permiten probar colores, encontrar valores RGB, Hex y HSLA, y crear paletas de colores desde cero.

13: Color

azul

Color, de HailPixel, le permite establecer exactamente el color que desea y luego le da el código hexadecimal.

Viola

Coloque el cursor en la pantalla y el color cambiará muy fácilmente a medida que se mueve; es como una esfera de color que regresa constantemente en códigos hexadecimales. Desliza la pantalla para ver el color, hacia arriba y hacia abajo para la saturación.

Obtén los códigos de un color

Si ha visto un color en alguna parte y no sabe exactamente cómo llamarlo, estas son las herramientas para usted.

14: SpyColor

SpyColor

SpyColor le proporciona información sobre cualquier color, incluidos códigos hexadecimales, RGB, CMYK y otros. La herramienta muestra varios tipos de patrones, como complementarios, de complemento dividido, triádicos, colisionantes y similares, en cada página de color.

15: Códigos de color HTML

Códigos de color HTML

Los códigos de color HTML encuentran los códigos hexadecimales de los colores de la imagen en su navegador. Seleccione una imagen en su escritorio y haga clic en «ver imagen», luego coloque el cursor sobre ella para obtener los códigos hexadecimales de las diferentes partes de la imagen.

Prueba tu paleta

Una vez que tenga una paleta de colores, debe saber si funcionará para una variedad de visitantes.

dieciséis: Mira mis colores

Mira mis colores

Check My Colors le permite controlar los colores de primer plano y de fondo de la paleta de colores, asegurándose de que proporcionen suficiente contraste para aquellos con deficiencias de color. Ya sea que desee proteger su daltonismo en su sitio o simplemente obtener los esquemas de color más efectivos e intuitivos desde una perspectiva de UX, esta herramienta es invaluable. Ingrese una URL y escupe un informe:

Mira mi prueba de color en 90 artículos

… Que básicamente revisa todo el código de su sitio y clasifica todos los elementos visuales en función de la visibilidad.

Imágenes adecuadas

Ahora que su paleta de colores está en su lugar y sabe que es muy visible, necesitará algunas imágenes coincidentes.

17: tiney

tiney

TinEye es mejor conocido como una alternativa a la búsqueda de imágenes de Google. Pero también funciona como una forma de explorar esquemas de color, utilizando una base de datos de más de 10 millones de fotografías con licencia Creative Commons tomadas de Flickr. Si busca imágenes con la combinación de colores perfecta, esta es una forma excelente y fácil de usar de buscarlas.

18: Inspiración

Inspiración

Designspiration le permite seleccionar hasta cinco tonos de una paleta de página completa, lo que le permite ver los colores con claridad. Luego, el sitio muestra todas las imágenes en su base de datos con ese esquema de color. Le muestra claramente los números hexadecimales y le permite hacer clic en los números hexadecimales individuales. Puede guardar imágenes en colecciones en el sitio y descargarlas.

Cómo utilizar una herramienta de comportamiento del sitio web para analizar las mejores paletas de colores

Puede pensar que todo lo que necesita hacer es elegir una paleta de colores para su sitio web y seguir adelante. Ésta no es la mejor forma de hacer negocios.

Piénsalo. Pruebe sus CTA, títulos y otros elementos del sitio web. ¿Por qué debería ser diferente el color?

Una herramienta de análisis del comportamiento del sitio web, como Crazy Egg, ofrece la oportunidad perfecta para aprender cómo responde su audiencia a la paleta de colores actual.

coito instantáneo con el huevo loco

Los informes de comportamiento del usuario, como los mapas de calor, le dirán si sus colores atraen la atención de los más importantes: sus clientes actuales y potenciales.

Cuando tiene datos sin procesar a mano, puede tomar decisiones informadas sobre la paleta de colores de su sitio web.

Imagina que has creado una web para una audiencia de amantes del deporte y que has elegido los colores azul y rosa, así como unos grises neutros. A tu audiencia no le gusta.

Tal vez no transmita lo suficiente tu buena imagen. Los amantes del deporte pueden preferir colores más atrevidos y oscuros y tonos tierra.

No lo sabrá hasta que realice la prueba.

Empiece a usar Crazy Egg

Cree una cuenta gratuita de Crazy Egg para comenzar su prueba gratuita o inicie sesión para configurar informes de comportamiento del usuario.

Puede ejecutar varias pruebas al mismo tiempo, para no perder horas, días o semanas. En su lugar, puede capturar datos en tiempo real y concentrar sus esfuerzos en encontrar la mejor paleta de colores posible.

Conclusión

La paleta de colores de su sitio web no solo debe reflejar su marca, sino también atraer a su audiencia. De lo contrario, las personas pueden quedar inhabilitadas de su sitio sin darse cuenta.

Empiece por lo que le guste. Considere elegir una paleta que sea diferente de las demás en su nicho para que se destaque. Así que empieza a probar.

Es fácil cambiar los colores en su sitio. Si está familiarizado con HTML, puede cambiar manualmente los códigos HEX en los archivos del tema. Muchos temas de WordPress también vienen con parámetros de personalización que le permiten cambiar los colores sin conocer ningún código.

Dese la oportunidad de hacer que su sitio sea lo más atractivo y memorable posible.

Prestar atención

Fuente: crazyegg