DanteCervantes.com

Crear degradados con CSS3

Publicado por : Dante | 5 junio, 2015 | 1:21 am

 

Muchas veces, los diseños que nos solicita ya sea en el trabajo o algún cliente, el diseño por lejos de ser complejo, contiene degradados en una o varias secciones del sitio web, como en los botones, menús, cabeceras, etc.

Este tipo de diseños hace algunos años y aún en la actualidad se siguen utilizando imágenes para lograr el objetivo, sin embargo esto no es nada recomendable, ya que al hacer el sitio con imágenes, estamos añadiendo peso y peticiones al servidor, eso sin mencionar que en dado caso que deba ser responsivo, lo cual hace que el sitio cargue lentamente, actualmente existe una herramienta la cual nos provee de una herramienta similar a la de Photoshop, para realizar cualquier clase de degradado, según sean las necesidades.

Ultimate CSS Gradient Generator

La pantalla principal nos muestra los colores por defecto, los indicadores de abajo podemos seleccionarlos y cambiar su color a voluntad, de igual forma si queremos añadir un nodo más para nuestro degradado, solo es cuestión de hacer clic en la barra indicadora y el programa añadirá el nuevo nodo en color negro.

6035487505514496

 

Así mismo el código que genera, podemos transformarlo a SCSS o CSS según lo requiramos.

Conclusión

Es realmente una herramienta muy importante para los distintos diseños que a nuestras manos lleguen, sin duda algo que debemos tener guardado en nuestro almacén de utilidades.

Recibe los mejores desarrollos y tutoriales

* campos requeridos

redes sociales