English Português

Es bien sabido por todos nosotros que el color en web es una de las herramientas que debemos de tener en cuanta a la hora de diseñar nuestro sitio, es importante tener ciertas nociones básicas sobre su uso y sus características para así poder crear paletas de colores interesantes y llamativas, recordemos que solo contamos con 9 segundos para poder hacer que nuestro usuarios se interesen en nuestro sitio o salgan de él.

Pero sucede que rara vez somos expertos en un tema bastante complejo, como es el color y sus mezclas, y es que no todos somos diseñadores y no todos debemos de tener too el conocimiento al respecto pero si podemos tener herramientas a nuestro alcance que nos ayuden a crear mezclas interesantes. De esta forma aunque no serás un experto de colores entenderás un poco sobre como mezclar los colores y al final del post te recomendaré herramientas para buscar sin problemas la paleta perfecta para tu sitio web.


Hablemos de colores



Colores primarios: son aquellos que mezclándose logran obtener el color blanco, en este caso son el Rojo, Verde y Azul

Colores secundarios son el resultado de la mezcal de dos primarios, el cyan, el magenta y el Amarillo

Colores Análogos: aquellos que se encuentran cerca de nuestro color, por ejemplo, para el rojo sus colores análogos pueden ser el el naranja y amarillo, o para le violeta o morado lo son el azul y magenta, por lo general estos colores combinan bien pero suelen crear una paleta de colores muy homogénea.

Colores Complementarios: aquellos que en el circulo cromático se encuentra enfrente del otro y son los que causan el mayor contraste entre si, ejemplo: azul- naranja, verde – rojo, amarillo – morado.

Algunas de las propiedades del color

Saturación de color: una propiedad del color que indica la cantidad de pigmento que el color tiene, se aplica sobre todo en pintura cuando se diluyen los colores.

luminosidad o brillo: aunque suele confundirse con saturación la luminosidad tiene que ver con la cantidad de blanco o de negro en nuestro color, en el caso de contener la mayor luminosidad nuestro resultado será casi blanco y de no tener luminosidad nuestro color será casi negro.

Como veras ahora tienes una noción básica sobre el color, recuerda que los colores azules en todas sus variantes se les denominan frios y los colores rojos, naranjas, marrones y amarillos se denominan cálidos, puedes crear una paleta con algunos colores análogos para dar uniformidad y tomar algún complementario que dará contraste y acentos.

Herramientas para hacer mezclas de color automáticas.

¡Ok! Pero ¿Qué pasa si no soy diseñador, se poco sobre el tema y quiero tener una buena combinación de colores en mi web? para esto les recomiendo 4 herramientas que he usado y me han sacado de problemas para crear paletas de color rápidamente.

Color Blender

ColorBlender una web donde a partir de un de un color que escojamos nos arrogara de manera automática, 5 colores para combinar, combinaciones que puedes usar como referencias para tus diseños y tienes la opción de bajar tu paleta para Photoshop, Illustrator o enviarla por mail.

4096 Color Wheel aunque como tal no es una paleta de color si es una gran ayuda ya que al elegir tu color te despliega en formato hexadecimal que color “seguro” es el más cercano y así tendrás la seguridad de que el color que escoges se verá tal cual lo quieres.

Kuler Una creación de Adobe Labs donde tus combinaciones pueden ser subidas y votadas  por otros usuarios, si quizás te parezca ilógico que recomiende esto cuando lo que quieres son paletas de colores a tu alcance, pero también puede bajar las paletas más votadas, y ver las más nuevas, por temáticas, etc. En fin todo un arsenal para que nunca tengas pretexto de no tener paletas de colores actuales y quizás encontrar por medio de otros usuarios otras combinaciones que nunca pasaron pro tu cabeza.

ColorScheme Una de las aplicaciones más completas que he encontrado para hacer combinaciones de colores muy completas, teniendo las herramientas de crear paletas a partir de colores análogos complementarios y las famosas triadas, triadas de cuatro, etc. la web es muy dinámica, es mi favorita

Por último

Espero que esta guía te sirva a comprender un poco más sobre el color, sus características, y sobre todo que las herramientas que te reseñamos te ayuden a hacer que el escoger sea una paleta de color no sea un dolor de cabeza  y si un proceso agradable, si haz usado otras que se te hagan interesantes y útiles ponlas en los comentarios lo ideal es que entre todos tengamos mas alternativas para este tipo de aplicaciones

Escrito por Ulises

Diseñador e ilustrador, Me encanta leer blogs, tutoriales y diseño. Me gusta escribir y compartir cosas interesantes, reflexionar sobre el futuro de la sociedad y sus formas de comunicarse, soy entusiasta del Web 2.0 y me gusta conocer gente; y si a esa charla le añades café, me has dado lo que necesito.

Blog / Twitter

Comentarios

  1. Francisco / Hace 4 años /

    Seleccionar los colores cuando intento diseñar web es uno de mis mayores problemas. Me es difícil encontrar paletas de colores que mejor vayan con lo que tengo pensado.

    Conocer un poco la teoría del color ayuda. Excelente post Ulises!

    Responder a Francisco →
  2. Ulises / Hace 4 años /

    ya extrañaba estar por este lugar de verdad. creeme que el color es de las cosas complejas para cualquier diseño, hay reglas a seguir, azules para dar seguridad naranja para cosas de comida, pero como lo dice su nombre son solo guías al final el color puede ser una forma de ponerle sello o estilo a lo que haces. es como vestir una día con cierta ropa a tu web y así dejarnos ver una imagen sobre ti o sobre lo que publicas.

    lo verdaderamente difícil creo yo no es seguir las reglas de lo que funciona mejor , lo cual siempre es muy recomendable es buscar comunicar sensaciones y personalidad con tu color ya sea un diseño, una ilustración o una página web.

    Responder a Ulises →
  3. de Molina / Hace 4 años /

    Por su sencillez y gran variedad, me quedo con colorcombos.com
    Saludos.

    Responder a de Molina →
  4. DAVID / Hace 4 años /

    Excelente articulo, justo cuando estoy diseñando mi web, casi todos tud articulos me han servido por lo menos un poco.
    Saludos cordiales.
    DA.

    Responder a DAVID →
  5. Rubix / Hace 4 años /

    Este artículo acaba de ser distribuido dentro de los diseñadores de Estudio Meetz, porque se que les será de gran utilidad.

    Muchas gracias compañero!

    Responder a Rubix →
  6. jordi / Hace 4 años /

    Gracias por el artículo, lo encuentro muy útil. Cuando empiece con el diseño de una nueva plantilla no dudaré en utilizar servicios como Color Blender, el mejor sin duda para mí.

    ¡Saludos Ulises!

    Responder a jordi →
  7. Andrea / Hace 3 años /

    Gracias, en serio. No sabes cuánto me has ayudado con este artículo :) Si hubiera estrellitas te pusiera 5, pero como no hay te pongo 5 caritas felices ☺☺☺☺☺

    Responder a Andrea →
  8. kenny / Hace 3 años /

    hola de seguro c q todos t felicitan por tu sabiduria , deseo saber q colores combinados me resultarian el color dorado

    Responder a kenny →
  9. marcelo / Hace 3 años /

    Muy buena nota, un excelente aporte, muchas gracias!

    Responder a marcelo →
  10. Matias / Hace 3 años /

    Bien, ahora si se por donde arrancar. Buena data la tuya. Gracias

    Responder a Matias →
  11. JSequeiros / Hace 3 años /

    Excelente trabajo.

    Responder a JSequeiros →
  12. Laura / Hace 3 años /

    Hola, me he llevado un poco de susto cuando he visto la ruleta de los colores primarios y secundarios y la explicación debajo de cuáles con. El verde y los azules poco tienen que ver con cómo son de verdad, y donde dice que son colores primarios en realidad son secundarios, y viceversa.
    Los colores primarios (color como pigmento) son el magenta (rosa fucsia oscuro), el azul cyan (nada que ver con ese azul clarito), y el amarillo cadmio medio. Los colores secundarios son el rojo bermellón (un rojo no muy fuerte), el verde (nada que ver con ese verde fosforito) y el violeta (no el azul añil que está indicado). El morado es un color terciario, al igual que el naranja o el verde azulado.

    KENNY, PARA HACER UN DORADO TIENES QUE MEZCLAR UN OCRE AMARILLO, UN VERDE ÓXIDO Y UN ROJO INGLÉS.

    Responder a Laura →
  13. eva / Hace 3 años /

    Gracias por la información, para alguien novato en la materia, viene de perlas!

    Responder a eva →
  14. Sarah Quijano / Hace 3 años /

    Gracias! Estoy trabajando con un diseñador en mi nueva web y esto me va a venir genial para decidir la paleta que escoger a partir del verde/gris de mi logo. ¿Tienes algún post que explique lo que significan los colores, como alguien decía que el azul daba seguridad?

    Responder a Sarah Quijano →
  15. olinda / Hace 2 años /

    guegu es lo mejos en el sitioguet collllllllllllllllllllll

    Responder a olinda →
  16. Pablo / Hace 2 años /

    me sirvio de mucho, la verdad que voy a basarme en eso

    Responder a Pablo →
  17. Ángel Madueño / Hace 2 años /

    colorcombos es una pagina del carajo pero jamás nada igualará a elegir colores por ti msimo sin ayuda y pensarlos bien creando realciones armónicas, claroscuros, calidez y demás…Do it yourself

    Responder a Ángel Madueño →
  18. david garrido / Hace 7 meses /

    excelente post la verdad es una de las partes mas complicadas para mi el saber que color ocupar en mis paginas pero apaartir de hoy ya no mas jajajajaja eres la pura ley

    Responder a david garrido →
  19. Mónica / Hace 6 meses /

    Me has dado una visión general del tema con herramientas prácticas y aplicables. No tengo nada que ver con diseño pero necesitaba nociones básicas para determinar combinaciones de color para un trabajo en particular. Gracias. El artículo es práctico y da información precisa.

    Responder a Mónica →
  20. rebeca / Hace 4 meses /

    ¡Súper buen tip el de las paletas de colores!

    Responder a rebeca →
  21. Fernando / Hace 2 meses /

    Muchas gracias.

    Esto me soluciona mi lado poco creativo de combinar colores.

    Responder a Fernando →

Responder

¡Gracias por dejar tu opinión! Por favor procura que tus comentarios estén dentro tema, que no sean promocionales (spam), ilegales u ofensivos, de otro modo, serán borrados. Todos los enlaces serán moderados y la URL indicada NO será enlazada.

Blog and Web es un blog de Blógstica. Hospedado desde 2008 en Liquid Web.

Términos de uso - Política de privacidad