Playful Little Tooltip Ideas

May 31, 2017 0 Comments

Playful Little Tooltip Ideas

 

 

Some little ideas for bouncy and playful tooltip shapes and animations with SVG and anime.js. Among other styles, we use shape morphing and transform.

TooltipAnimations

Today we’d like to share a couple of simple tooltip animation ideas with you. The tooltips have different shapes mostly made of SVGs and we are animating them with anime.js. Some of these bouncy fellas use SVG path morphing, others transforms and one is a simple text effect.


Attention: Heavy use of modern CSS properties like CSS grid and flexbox so don’t use a killjoy browser to view the demo.

Have a look at some of the styles:

TooltipAnimations01

TooltipAnimations02

TooltipAnimations03

We hope you enjoy these little ideas and find them inspirational!

References and Credits


Tag cloud