1. Web Design
  2. HTML/CSS
  3. SVG

Consejo rápido: transforma fácilmente SVGs utilizando Shape Shifter

En el consejo breve de hoy, te voy a enseñar cómo transformar una forma SVG en otra usando una herramienta llamada Shape Shifter de Alex Lockwood.
Scroll to top
1 min read

Spanish (Español) translation by Carlos (you can also view the original English article)

En el consejo breve de hoy, te voy a enseñar cómo transformar una forma SVG en otra usando una herramienta llamada Shape Shifter de Alex Lockwood.

Mira el screencast

Shape Shifter (entre otras cosas) toma los SVGs importados y los transforma automáticamente de unos a otros. Mientras los dos SVGs tengan el mismo número de nodos de ruta, la animación entre las formas será perfectamente fluida.

En este consejo breve, tomaremos el ícono «menú de hamburguesa» y lo transformaremos en un icono de «cierre» (un ejemplo de uso bastante clásico).

shape shifter demoshape shifter demoshape shifter demo

¡Échale un vistazo al video para ver cómo se hace!

Recursos útiles