Animation

Shape toggle morph icon

Ein einzelnes gefülltes Symbol wechselt nur dann zwischen zwei Formen, wenn darauf geklickt wird, wobei seine Umrisse direkt von einer Silhouette in die andere übergehen und seine Farbe entsprechend überblendet und dann gehalten wird, bis erneut geklickt wird.

Shape toggle morph icon verwenden

Teste die Vorschau mit Maus und Tastatur. Prüfe den sichtbaren Fokus und das Layout auf schmalen Bildschirmen in deiner eigenen Seite. Nenne deinem Agenten die Nummer oder den Bezeichner, um diese Komponente abzurufen.

Eigenschaften: shapeA, shapeB, colorA, colorB, size

Welche Frameworks sind verfügbar?

Der Katalog enthält diese Versionen: react, vue, svelte, astro, html. Die Vorschau auf dieser Seite verwendet React.

Wie greife ich auf die Implementierung zu?

Vorschau und Beschreibung sind öffentlich. Melde dich mit einem berechtigten Konto an, um Code, Framework-Versionen und Installation zu öffnen.

Verbinde deinen Agenten

Ähnliche Komponenten

2192Morphing icon loopAnimationEin einzelnes gefülltes Symbol formt sich kontinuierlich in das nächste Symbol in einer kurzen Liste um, wobei seine Umrisse fließend von einer Silhouette zur nächsten übergehen, während sich seine Füllfarbe entsprechend ändert.

2170Icon Shape MorphAnimationEin einzelnes gefülltes Symbol formt sich nahtlos in das nächste Symbol in einer Sequenz um, wobei sich der Umriss kontinuierlich zwischen den Formen verzieht, anstatt zu überblenden oder zu vertauschen.

2193Morphing icon toggleAnimationEin kleines Symbol verändert seinen Umriss in einer stetigen Schleife kontinuierlich zwischen zwei Formen und zwei Farben.

1669Blur revealAnimationEin Wrapper, der sein untergeordnetes Element unscharf und leicht versetzt hält, bis es zum ersten Mal in das Ansichtsfenster eintritt, dann die Unschärfe auflöst und die Lücke in einer Bewegung schließt.

1763Bobble tile gridAnimationEin Gitter aus farbigen Kacheln, die auf einer Feder vom Zeiger wegbewegen und umso stärker abprallen, je schneller der Zeiger darüber gleitet.

1672Burst particle emitterAnimationUmhüllt jedes Element und feuert einen gestaffelten Fächer kleiner Flecken von einer ausgewählten Kante ab, beim Klicken, in einer Schleife oder beim ersten Scrollen in die Ansicht.