Con la popularización del Flat Design, el uso de colores sólidos en sitios web se ha incrementado. Sin embargo, al usar gradientes puedes darle un toque especial a tu sitio web y hacer que le fondo no se vea tan monótono, por eso usar gradientes sigue siendo una práctica común en el diseño de sitios web. En este artículo te mencionamos algunas páginas de destino que han sabido incorporar las gradientes en sus diseños. Esperamos que te sirvan como referencia si en algún punto decides trabajar con gradientes.
Stripe
Se usa una gradiente que va del azul al celeste. El cambio es bastante sutil.
Bolt
Este sitio posee una animación y la gradiente va variando. Tiene un fondo con una retícula de figuras geométricas, el logo se alinea en esta retícula.
Santosidaniel
Emplea colores tenues en su gradiente. El cambio es bastante sutil y casi no se nota.
Snippit
Este sitio emplea una gradiente de tonos morados. Esta gradiente es un filtro que se aplica sobre una foto, dando a la imagen estos tonos.
Gibbon
Se emplea una gradiente de tonos verdes bastante sutil. Los tonos elegidos están llenos de vida y le añaden un toque divertido y amigable a la página. La gradiente se ha aplicado sobre una fotografía.
Koffie Verkeerd
Esta página presenta una gradiente de tonos verdes, desde uno saturado hasta otro más pastel. También tiene una textura granulada lo que hace ver los colores más opacos.
Skyline Design
Se usa una gradiente de tonos verdes que se aplica sobre una fotografía, lo cual le da un aspecto más estilizado y refuerza el título donde se menciona la palabra “marciano”.
Snipcart
Se ha usado una gradiente de tonos amarillos. El cambio se hace más notorio pues en el fondo se han colocado barras diagonales y cada barra tiene un tono de amarillo distinto. Este fondo le da más movimiento a la página.
TWC WiFi-Denti-Fier
Se usa una gradiente de tonos grises bastante tenues. Se hace énfasis en el centro, donde se encuentran ubicados 6 alegres personajes.
Celilcan
Este sitio nos presenta un slider en su página de inicio. Cada fotografía de su slider presenta una gradiente distinta, acompañada de una frase diferente. Asimismo, cada imagen del slider posee una textura como fondo.
Lab19
Usan una imagen de fondo y le aplican una gradiente que va desde azul hasta naranja. Obviamente, debido a lo diferente que son los colores es cambio es notable, pero se genera un buen contraste.
Filament
Emplea una gradiente de tonos morados. El cambio es bastante ligero y sutil.
Raven
Este sitio tiene una gradiente radial de tonos grises oscuros. Ya que uno de los elementos principales se halla en el centro, esta zona presenta colores ligeramente más claros.
Pixsta
Este sitio presenta una gradiente ligera, desde un tono oscuro hasta uno más claro. La lectura visual se realiza de arriba hacia abajo.
Onehub
Se usa una gradiente de tonos verdes llenos de vida hasta llegar uno que se ve más opaco. Se usa una tipografía blanca para que aumente la legibilidad.
Carbonmade
Se usa una gradiente de tonos celeste, desde el más oscuro hasta el más claro. La página tiene ilustraciones simple, en el fondo se colocan nubes, a modo de imitar el cielo.
Serj
Este sitio emplea una gradiente que va desde azul hasta tonos amarillos. Ya que los colores son diferentes el cambio es notorio. Presenta una textura en la zona amarilla, para imitar la arena de la playa.
Newism
Se emplea un gradiente de tonos morados oscuros. Además, se emplean barras horizontales en el fondo, haciendo que el cambio entre tonos sea más notorio.
Harmony Republic
En este sitio se hace uso no sólo de gradientes sino que hace un excelente uso de las texturas. El cambio de color es más notorio en la zona del centro, donde se hace un paso de amarillo a verde.
Eastpoint
Se hace uso de una gradiente de tonos grises hasta llegar al blanco. El ángulo agudo de la gradiente hace más notorio el cambio entre tonos.