25 usos brillantes de espectros coloridos en diseño web

He notado una tendencia reciente en el diseño web que involucra el uso de espectros coloridos como elemento de diseño principal. Los usos son muy variados pero casi siempre bastante hermosos.

Hoy aprenderemos cómo construir increíbles ilustraciones basadas en el espectro en Photoshop y luego veremos 25 ejemplos brillantes de espectros que se utilizan en sitios web reales.

Cómo divertirse con Spectrums en Photoshop

Antes de ver nuestra selección de sitios que utilizan los espectros como un elemento de diseño principal, veamos cómo puede construir fácilmente su propia obra de arte de espectro impresionante en Photoshop. He revisado una técnica similar en un tutorial anterior, pero definitivamente es apropiado para este artículo también.

Construir gradientes complejos en Photoshop puede llevar mucho tiempo. Afortunadamente, viene incorporado con algunos espectros geniales que puede aplicar en solo unos pocos clics.

Para empezar, crea una capa negra sólida. Luego duplique esa capa y aplique una superposición de degradado a cualquier capa que se encuentre en la parte superior. Para cargar los gradientes de espectro, golpee la pequeña flecha a la derecha del selector de gradiente y vaya hasta la parte inferior donde dice "espectros".

Seleccione cualquier espectro que le guste y establezca la dirección a lo que considere apropiado. Debido al horrible resultado inicial de este paso, imagino que muchos diseñadores nunca han pensado usar estos gradientes preconstruidos. Sin embargo, recuerde siempre ver los efectos de Photoshop como bloques de construcción, no como productos terminados.

Lo que sigue a continuación es realmente fácil de convertir en algo que se ve realmente genial y se ajusta a las tendencias de diseño moderno.

El siguiente paso es crear una capa blanca sólida y seleccionar Filtro> Fibras de procesamiento. Realmente no importa cuáles sean sus configuraciones para las fibras, solo juegue hasta que obtenga algo que le guste.

Ahora aplique un simple desenfoque de movimiento. Asegúrate de subirlo para que las líneas sean agradables y suaves. Puedes ver en la imagen de abajo que esto nos dará una textura realmente agradable con mucha profundidad y contraste.

La magia sucede cuando configuras esta capa para multiplicarse. Voila! ¡Ahora tu espectro se ve mucho más genial!

Para hacerlo más dramático, aplique una máscara de capa negra sólida y luego agarre un conjunto grande de cepillos suaves a blanco. Luego, haga clic en el lienzo dos o tres veces con el pincel para recuperar el degradado de una manera sutil y atractiva.

¡No te detengas ahí! Juega con otros filtros y efectos para crear tu propia toma única de espectros. La imagen de abajo usa el mismo proceso exacto que se muestra arriba, pero usa nubes en lugar de fibras (elimine el paso de desenfoque).

Como dimensión final, una vez que comiences a mezclarlo con gráficos, el efecto puede llegar a ser realmente increíble realmente rápido. A continuación, coloqué una brújula y pude obtener algunos resultados impresionantes después de solo unos segundos de ajustes.

Espectros en los fondos del sitio web

Para tener una idea de cómo aplicar estas técnicas en la práctica en el mundo del diseño web, consulte los grandes ejemplos a continuación. Esta primera sección implementa espectros de color como el punto focal principal del fondo del sitio.

Diseño Web Cheltenham Reino Unido

BundleHunt

Rareview

Agencia web creativa.

Gremio de escritores de diseño

Haga clic en Tyler

La manera creativa

Tema del espectro

deaxon

Lógica por diseño

Diseñador de sitios web griego

Lista ordenada

Ciplex | Cabaña de diseño

Iglesia de la vida | Bienvenido

Julio plata

Robin James Yu

Empresa de diseño web

Burubundi

Wir lieben Enlaces

Logos y otros elementos

Aquí vemos espectros que se utilizan para crear iconos, logotipos y otros elementos gráficos extremadamente atractivos. Observe cómo a veces los diseñadores utilizarán pasos difíciles en lugar de gradientes suaves. ¡Otra opción más a tener en cuenta!

Caleidoscopio

Drupal trabaja

Hughes

Creaciones Neutron

Rua de Baixo

Conclusión

Espero que esta publicación haya sido muy inspiradora y que te aliente a jugar con espectros en tus propios diseños.

Si diseña o encuentra sitios que utilizan espectros de una manera única e impresionante, deje un comentario a continuación con un enlace para que todos podamos verlo.