Category: organic

Gradient Topography Animation

Today we’d like to share a shape layer animation with you. The inspiration for this effect comes from the fantastic work by Diana Hlevnjak (Polar Vector) “Gradient Topography”. We use anime.js for the animations and Charming for the letter effects. After seeing the artwork, we thought it would be awe...

Dynamic Shape Overlays with SVG

Today we’d like to share another way of achieving morphing page transitions. This time, we’ll generate multiple SVG curves with JavaScript, making many different looking shapes possible. By controlling the individual coordinates of the several layers of SVG paths, the curved shapes animate to a rectangle (t...

Organic SVG Shape Morph Ideas

Today we’d like to share some more animated organic SVG shapes with you. The idea is to integrate some flowy, natural looking shapes into a web page as decorative elements, sometimes with an interaction, i.e. a background of menu that changes on hovering the menu items, or simply, a constantly animating wave back...