50 Paletas de color de inspiración para el diseño de tu página web

Hay muchas formas de que tu página web destaque en internet. Una de ellas es mediante su paleta de colores que, por cierto, es lo primero que llama la atención cuando la gente visita tu página. Puedes tener un producto increíble y un texto profesional, pero si tu paleta de colores es poco atractiva, las probabilidades de que los visitantes hagan clic en tu página son pocas. Elegir los colores web adecuados es un aspecto clave a la hora de crear una página web.


Cuando elijas los tonos, piensa en el rol que jugará cada uno de ellos en tu página web. Generalmente se aconseja separar los colores para páginas web en primario (o "dominante"), secundario y el color de acento. El color primario será el que mayor espacio ocupe en tu página web y el color con el que probablemente la gente asocie tu marca. Tu color (o colores) secundario tendrá menos presencia, y el color de acento tiene un uso moderado. La función del color de acento es llamar la atención de los visitantes en detalles importantes que quieras resaltar como los llamados a la acción o tu marca.


Si has dedicado tiempo a elegir la paleta de colores perfecta para tu negocio, haz lo mismo con tu página web. Los colores pueden evocar ciertos estados de ánimo y generar asociaciones con nuestro entorno o experiencias pasadas. Por ejemplo, la psicología del color nos enseña que el azul se asocia con frecuencia a sentimientos de confianza y lealtad, mientras que el morado representa lujo o imaginación. Cuando elijas los tonos de tu página web, piensa lo que quieres transmitir y la gama de colores que mejor refleje tu marca.




Aunque siempre puedes usar un generador de paleta de colores, te recomendamos que también visites otras páginas web para inspirarte. El esquema de colores de las 50 páginas que te mostramos a continuación –todas creadas con Wix– son un magnífico ejemplo por su potente impacto visual:



01. Tonos llamativos y atrevidos


La página de The Robin Collective, una mezcla creativa de artistas y diseñadores, te recibe con una explosión de color. El radiante fondo amarillo evoca alegría, luz y positividad, mientras que los tonos complementarios azul, rosa y naranja agregan un punto travieso y divertido. Si vas a elegir una gama de colores muy saturados, asegúrate de agregar tonos neutros como el blanco o el gris para equilibrar el efecto final.




02. Elegante y chic


La marca de ropa de cama Undercover ha creado una sólida identidad de marca usando una paleta de colores coherente en toda su página web. El azul marino combinado con suaves tonos crema y gris transmite una sensación de lujo y constituye la base de su gama de colores. Esta combinación se mezcla con imágenes de plantas que agregan calidez y vida a su estética general.




03. Tonos otoñales


Sticky Lemmon, una marca de accesorios para niños, es un buen ejemplo del uso de colores para páginas web. Cada fotografía está cuidadosamente diseñada en términos de composición y color. La gama de colores elegida tiene un ligero aire retro con tonos naranjas y marrones que recuerdan a la vajilla de nuestros abuelos. El menú está compuesto por dos colores complementarios, el azul y el naranja, que ayudan a diferenciar y separar las pestañas del menú.




04. Gama de colores minimalista


La paleta de colores monocromática de la artista Sasha Pivovarova le confiere a su página web un look limpio. Juntando el negro con tonos grises pálidos (en vez de hacerlo con el blanco), consigue un contraste suave y elegante a la vez. Estos tonos se pueden combinar con casi cualquier color para darle vida al diseño de tu página web.




05. Tono acaramelado


El rosa bebé y otros tonos pastel son los protagonistas cromáticos de la página web de Vanessa McKeown. Usando grandes bloque cuadrados, consigue mantener la coherencia y orden en su rica paleta de colores pastel. El fondo con textura de puntos Polka agrega un bonito contraste a las superficies planas y encaja perfectamente con su estilo.



06. Sueño de nubes


En su página web, el diseñador gráfico Run Wild ha prestado mucha atención al color con un sugerente video de fondo con suaves nubes deslizándose en una montaña. El llamado a la acción es un botón de color turquesa que contrasta con el fondo e invita al visitante a presionarlo. A medida que te desplazas hacia abajo en la página, podrás notar cómo disminuye discretamente la intensidad de su paleta de colores fríos creando un bonito efecto visual.


07. Tonos sutiles y claros


La diseñadora e ilustradora Ivy Chen ha conseguido combinar el rojo con el rosa pálido de una forma inusual. Ivy ha sabido incluir la dosis perfecta de cada tono usando el color de la luz como color principal y el rojo como color de acento a través de finas líneas y letras de pequeño tamaño. De haberlo hecho al revés, el efecto dominante del rojo brillante habría eclipsado la presencia del rosa.



08. Paleta de colores suave y natural


La ilustradora Christine My Linh, creadora de Blush & May, utiliza tonos suaves y mucho espacio en blanco en la página de inicio de su sitio web. La artista ha minimizado el uso del color recurriendo a tonos rosa pálido y beige junto con algunos tonos naturales de marrón y verde. Su gama de colores transmite una sensación de calma y quietud que encaja perfectamente con lo que ofrece su trabajo como ilustradora.



09. Tono verde fluorescente


La paleta de colores elegida para la página web de Two One Studio consigue su objetivo: diferenciarse del resto. El borde en verde fluorescente que enmarca toda la página web lo dice todo. El mismo tono verde se repite en otros lugares estratégicos de la página como los botones de los llamados a la acción. Con eso consiguen llamar nuestra atención y, al mismo tiempo, guardar coherencia con el resto del diseño de la página.



10. Fondo industrial y urbano


Elegir un esquema de colores para una página web de fotografía puede ser un auténtico reto. En Béton Brut, el portafolio de fotografía y arquitectura de Kimberly Jane Harris, la imagen de un edifico de cemento ocupa toda la página de inicio. A pesar de lo monocromática que es la imagen, los aburridos tonos marrones de aire industrial forman interesantes composiciones. La letra en color blanco del menú es visible sin llegar a robarle protagonismo a la fotografía.



11. Paleta de colores Retro Pop


El diseño del portafolio de Dennis Krawec es un verdadero regalo para los ojos. Es un gran ejemplo de cómo una paleta de colores web aparentemente disonantes, puede funcionar perfectamente para crear una potente identidad visual. El portafolio apuesta por un fondo rosa retro acompañado del azul neón, amarillo, verde, naranja y otra gama de rosas. Esta desenfada combinación funciona muy bien en el peculiar diseño de la página porque respeta el espacio y la consistencia: si te fijas, los botones y el menú están en el mismo color para crear claridad.



12. Degradados futuristas


Es innegable que los degradados son una de las tendencias de diseño web, y Avnish Parker es un ejemplo de cómo usarlos con maestría. Su gama de colores está compuesta por tonos oscuros que se funden con otros más claros creando un look elegante y moderno. En las páginas web con fondos oscuros, se puede recurrir al contraste de colores brillantes para agregar equilibrio y resaltar algunos elementos.



13. Esquema de colores alegre


Izzy Wheels, una marca que diseña cubiertas de ruedas para minusválidos, apostó por colores web súper alegres y llenos de vitalidad para su página web. Su paleta de colores es muy variada y está compuesta de azul, rojo, verde, amarillo, morado, etc. Estos colores funcionan muy bien juntos gracias a su nivel de saturación. Además, los pocos detalles que aparecen en blanco ayudan a evitar el caos de la página.


14. Sencillo y minimalista


La ceramista Noni São Paulo utiliza una paleta de colores cálidos que refleja perfectamente su marca y productos. Los tonos marrones cálidos y otros de aspecto terroso te despiertan las ganas de tomarte un té con una bonita taza y en buena compañía. El fondo blanco equilibra los tonos naturales para garantizar el look profesional de su página web.



15. Gama de colores tecnológicos


El diseñador de arte y animación Kidmograph ha elegido una paleta de colores tricolor para la mitad de su página de inicio. El color cian le confiere a su página web un look futurista que se magnifica con la imagen en movimiento. Para los textos recurre al blanco para que destaque perfectamente con el fondo negro. En general, usar el blanco y el negro con un tercer color es una buena opción para transmitir una imagen cuidada y profesional.



16. Tonos dorados


El portafolio de la diseñadora de interiores Kathrine Espersen se caracteriza por la clase y elegancia que evocan sus tonos dorados. Combinando la cantidad justa de dorado con el blanco y el negro, la diseñadora consigue crear un look elegante. Cuando se recurre a este color, se pueden usar distintas tonalidades para conseguir un efecto más sutil.



17. Gama de grises y magenta


La agencia creativa Mutiny sigue el mismo esquema de colores en toda su página web. Han creado un intrigante contraste combinando grabados históricos en blanco y negro con el magenta más contemporáneo. Los detalles en magenta están estratégicamente distribuidos en la página para subrayar o enfatizar ciertas palabras.



18. Fondo azul cobalto


Esta página web es otro ejemplo que apuesta por un color muy dominante. Los responsables de Studio&more han elegido un llamativo azul cobalto para su página de inicio usando para sus títulos, el menú y los íconos sociales un blanco inmaculado. El color blanco destaca en el fondo azul garantizando la legibilidad y accesibilidad de tu página web. Si eliges una paleta de colores binaria, puedes agregar un tercer color que solo aparezca al deslizar el puntero del ratón por los botones como han hecho en Studio&more.



19. Arcoíris en tono pastel


Los coloridos tonos de este ejemplo son lo que cualquiera esperaría encontrar en una página web de adopción de unicornios. Para crear el sentido del orden y la jerarquía del mundo de los unicornios, los diseñadores se han ceñido a solo tres colores (blanco, azul claro y rosa pastel) para los elementos de la página: logotipo, menú, íconos y botones. La generosa presencia del blanco ayuda a que el diseño no parezca estar excesivamente recargado.



20. Relajante y natural


El blog Styling by Why Dee tiene una galería de fotos al estilo Pinterest y una acertada tabla de colores web. Su paleta de colores neutros combinada con texturas de mármol y madera transmiten una sensación de calma. El poco uso del negro ayuda a fortalecer el aire natural del diseño, y los pocos colores brillantes que hay presentes agregan un toque especial.



21. Cálido con tonos fríos


La diseñadora de producto Adelaide Wang usa muy poco color para conseguir el máximo efecto. La mitad superior de su portafolio es principalmente en blanco y negro con pequeñas notas de color distribuidas en determinadas palabras para resaltarlas. También mezcla un bonito tono azul con un naranja cálido, dos colores que juntos funcionan muy bien.



22. Gama de colores otoñal


La diseñadora gráfica, ilustradora y rotulista June Digan ha elegido mostrar sus ilustraciones pintadas a mano en un fondo blanco y limpio. Su página de inicio incluye toda una variedad de tonos verdes y naranjas de distintas texturas combinados con una suave gama de grises. Su acertada paleta de colores consigue crear una atmósfera acogedora y otoñal al instante.



23. Fondo oscuro y misterioso


La cantante y artista visual IAMEVE ha creado un llamativo look para su página web. El color morado generalmente expresa lujo y misterio. En este ejemplo, con el marcado degradado que ocupa toda la página, los tonos morados consiguen crear un efecto misterioso, especialmente cuando se combinan con imágenes chispeantes y animaciones en el fondo.



24. Original y diferente


Dan Palmer, diseñador de animación, ha elegido una clásica paleta de colores azul y blanco. Según la psicología del color, el color azul generalmente transmite confianza. En esta página, se ha empleado en bloques cuadrados con el blanco logrando un efecto bastante profesional. Puedes usar esta paleta de colores con unos algunos tonos extra (como los verdes que utiliza Dan) para darle un toque de dinamismo a tu página.



25. Esquema de colores dinámico


El estudio de diseño Brown Owl Creative ha recurrido a una paleta de colores vivos e impactantes para crear una atmósfera jovial sin renunciar a tener un look profesional. Los amplios espacios vacíos y la definición de las formas ayudan a reducir el tono de la página web a pesar de su vibrante gama de colores. También han conservado el azul como color de acento en toda la página.



26. Combinado doble


Los trabajos de la ceramista Valeria Monis están compuestos de únicamente dos colores: azul real y blanco. Para diseñar su página web ha decidido seguir el mismo patrón: blanco para el fondo y azul oscuro para los textos. Si eliges una paleta de colores minimalista como la de este ejemplo, siempre puedes agregar de forma sutil un tercer tono para suavizar la estética general. En este caso, Valeria ha incluido un fondo azul pálido que apenas es visible pero que proporciona cierta profundidad.



27. Mini fiesta


La ilustradora Jennifer Xiao tiene un portafolio online que está para 'comérselo' gracias a su paleta de colores y sus preciosas imágenes. La página de Jennifer está salpicada de un montón de colores pastel donde mezcla sin complejos el rosa bebé con el amarillo, rojo, morado, turquesa y otros tonos. El conjunto forma un divertido look que se ve compensado con finas líneas negras y generosos espacios blancos en el fondo.



28. Paleta de colores luminosa


La artista Brooke Cormier ha elegido para su página web una combinación clásica de colores con tonos sombreados de azul claro para el fondo. Todo está perfectamente equilibrado: el blanco se usa para romper el tenue azul, y la suavidad y naturalidad del marrón agrega cierta diversidad.



29. Tonos llamativos y alegres


Con solo echar un vistazo a la página web de Frankie Ratford queda claro que está llena de vida y energía, y que su paleta de colores juega un rol fundamental. El amarillo brillante del fondo evoca alegría, especialmente cuando se combina con los otros colores vivos con los que te cruzas en la página. También se nota el ínfimo uso del negro. En su lugar, Frankie opta por usar textos en verde oscuro para crear contraste cuando es necesario.



30. Fondo negro


Los fondos negros se están convirtiendo en tendencia en el mundo del diseño web y el portafolio online de la diseñadora Ester Mejibovski es una buena muestra de ello. El fondo oscuro resalta sus trabajos para que los visitantes presten atención al evento principal. El alto contraste permite que el texto blanco pueda ser pequeño pero a la vez discreto y legible.



31. Gama de colores vintage


La ilustradora Naomi Wilkinson tiene sin duda un buen ojo para los colores web. En lugar de usar un fondo blanco plano, utiliza un agradable tono crema que complementa sus trabajos. Su paleta de colores retro tiene ligeros y discretos tonos rojo, amarillo, azul y verde. A pesar de haber usado una amplia gama de colores, estéticamente funcionan muy bien todos juntos.




32. Gama de colores monocromática


En lugar de usar el típico texto negro sobre fondo blanco, ¿por qué no variar un poco como ha hecho el diseñador gráfico Stephen Bradbury aquí? Stephen ha elegido una paleta de colores elegantes compuesta por blanco, negro y un color extra ocasional. Al agregar discretas animaciones y una autogalería, elimina cualquier posibilidad de aburrir al visitante.



33. Fuerte contraste


Si quieres un diseño simple a la vez que atractivo, siempre puedes ir sobre seguro eligiendo una gama de colores minimalistas compuesta de blanco, negro y un color extra. En este ejemplo, el ingeniero aeroespacial Chris Covert ha logrado crear un CV online único con solo tres colores. A pesar de usar una paleta de colores minimalista, consigue mantener el interés usando el efecto parallax e imágenes de cierto impacto.



34. Paleta de colores metalizados


El estudio de diseño digital extraweg de Oliver Latta combina varios tonos rosa con un toque metalizado para crear un look onírico. Si eliges un look monocromático para tu página web, procura agregar varios tonos para crear cierto contraste y jerarquía. También es recomendable que resaltes ciertos elementos como lo hace Oliver en su página.



35. Colores de acento vivos


La diseñadora multidisciplinar Lena Steinkühler expone sus trabajos a toda la pantalla de la mitad superior de su web. Aunque las imágenes de vívidos colores van cambiando, su paleta de colores base - compuesta mayoritariamente por el amarillo y el rosa coral - permanece cohesionada. Estos tonos contrastan con el fondo y complementan la galería de imágenes.



36. Esquema de colores sofisticado


Little Paper Warriors, la marca de la ilustradora Sophie Reid, tiene un esquema de colores muy singular en su página web. Para el fondo de su página ha elegido tonos térreos con cierta textura combinados con colores vivos. El resultado es un look alegre pero suficientemente maduro y sofisticado gracias a los tonos neutros.



37. Batido de arándanos


La página web de Melissa Lee, también conocida como Mademoiselle Opossum, se caracteriza por su deliciosa combinación de colores web. El carrusel de imágenes de su página de inicio está compuesta de diferentes tonos, pero todos combinan perfectamente con el encabezado y el pie de página morados. Si tú también tienes un carrusel de imágenes en tu página, asegúrate de que las imágenes sigan el mismo tono y voz de tu gama de colores para crear un resultado homogéneo.



38. Gama de colores de alto contraste


A la hora de retratar alimentos, el color juega un rol fundamental. El Chef Jean-François Bury ha experimentado combinando el fuerte contraste del blanco y negro con el frescor que destilan los colores de las fotos de sus platos. El resultado son unos colores cuya vivacidad destaca sobre el fondo oscuro haciendo que casi sea posible 'tocar' las zanahorias.


39. Tonos pastel


La marca de galletas Yumm ha elegido una suave y cálida paleta de colores pastel para su página web. Los diferentes colores comparten una tonalidad similar lo que permite que funcionen bien todos juntos. Para agregar cierto contraste, han incluido el negro y el marrón oscuro así como tonos azulados que destacan entre los cálidos tonos naranja.



40. Fondo oscuro e inquietante


Los oscuros tonos de la página web del diseñador gráfico Beeple ayudan a crear una atmósfera tan inquietante como turbadora. El texto de grandes letras blancas equilibra el conjunto añadiendo el contraste necesario para que sea legible. Aunque las imágenes van cambiando, se repite el uso de colores oscuros y misteriosos para reforzar el look general de la página.


41. Tonos deliciosos


La paleta de colores pastel de la página web de Kokos Ice Cream destila alegría y tentación. Su homogéneo fondo ayuda a que destaque la imagen del helado. El texto en gris oscuro sobre el claro fondo ofrece suficiente contraste mientras se mantiene la frescura y punto juguetón de la web.


42. Potente y llamativo


En su portafolio online, la diseñadora multidisciplinar Liron Ashkenazy presenta sus llamativos trabajos con una gama de colores igual de llamativa. Aunque todos sus proyectos son diferentes, ha logrado organizar los colores de forma armónica para proyectar una imagen consistente. Fíjate también en el uso que hace del azul: está presente en todos sus trabajos y el menú. Su favicon de color magenta en las pestañas del navegador es otro buen ejemplo del uso del color.



43. Gama de colores alegre y feliz


La llamativo elección del naranja en la página web de Dogs on the Streets evoca positividad, sobretodo acompañado del blanco. Además de usar un vívido naranja, también han elegido como color secundario el gris oscuro, y no el negro, para mantener el tono de cercanía que buscan.


44. Mágico espacio exterior


El estudio de branding y diseño web Citisionship Design ha elegido una acertada gama de colores para la mitad superior de su página. El texto blanco y los íconos destacan con fuerza sobre el fondo azul oscuro, mientras que las diminutas estrellas añaden cierta profundidad. Fíjate en el inteligente uso del azul como color de acento. Con él consiguen subrayar detalles importantes y hacer más clara la navegación en la página web.


45. Tonos infantiles


La página web de Inkbye Studios es un derroche de jovialidad y alegría con sus ilustraciones animadas y su paleta de colores vivos. A pesar del tono kitsch de la gama de colores, éstos funcionan muy bien gracias al uso del blanco y negro como colores complementarios que proporcionan el contraste que pide la vivacidad del diseño.


46. Paleta de colores neutros


El minimalista portafolio de la diseñadora gráfica Anja Ellenberger es un ejemplo del uso de cada color en su cantidad exacta. El tono general es ligero con rosas pálidos, grises y marrones. Destacan también los amplios espacios en blanco que agregan cierto sentido de amplitud.


47. Otros colores primarios


Aunque los colores primarios puedan parecer un tanto básicos o infantiles, puedes jugar con ellos de muchas maneras y conseguir un diseño elegante. Eso es lo que ha hecho la diseñadora textil Reut Chen que ha optado por el azul marino en lugar del clásico azul brillante. Al combinarlo con un amarillo y rojo llamativos consigue un aire chic a la vez que risueño.


48. Combinaciones únicas


Con la inusual paleta de colores que ha elegido Ariel Noltimier Strauss para su portafolio online, esta artista multidisciplinar consigue presentarse como lo que es: una artista distinta y singular. Elegir tonos beige para la mitad superior de la página no es algo habitual, pero combinados con interesantes imágenes, profundidad y textura, demuestran que cada detalle ha sido pensado y colocado con un propósito.


49. Color acento de contraste


El enfoque cromático del estudio Shapeshipt para su página web es bastante singular. Su paleta de colores está compuesta por un fondo oscuro y un color de acento que se repite en toda la página. La elección del amarillo para los íconos del menú, los botones y otros pequeños detalles ayuda a que éstos últimos destaquen a la vez que agrega cierta vida a su monocromática gama de colores.



50. Gama de grises con punto de color


Studio Sahil es una agencia de diseño industrial que emplea en su web una paleta de colores minimalistas. Sus fotografías de productos juegan con luces y sombras creando una amplia gama de grises claroscuros. Para romper esa 'monotonía gris', su llamativo logo es de un vivo color azul acompañado de un tono mostaza que añade vida a la página.



Publicado por Equipo Wix





es03.png