Transformicons machen sich eine Kombination aus SVG, CSS und HTML zu Nutze, um Symbole und Icons auf einer Website zu animieren, etwa in der Navigation. So können Menüs von ihrer Ausgangsposition in ein anderes Symbol – etwa ein „X“, Minus oder in verschiedene Richtungen weisende Pfeile – umgewandelt werden. Auch E-Mail- und Video-Symbole lassen sich so beispielsweise mit einer Animation versehen.

Transformicons werden bereits von zahlreichen Browsern unterstützt; neben Chrome, Firefox, Safari und Opera bieten auch der Internet Explorer ab Version 10 sowie iOS, Android und Chrome für Android Support für die animierten Icons.

Auf der Transformicons-Projekt-Website finden sich nicht nur weitere Informationen in der Dokumentation, sondern auch eine Live-Demo sowie die Möglichkeit, mithilfe eines Builders die Icons an die eigenen Bedürfnisse anzupassen.

Aufmacherbild: Signing and pavement-marking / photography of road markings and traffic symbol on surface road von Shutterstock / Urheberrecht: R.Iegosyn