Cargando
HTML + CSSLoader

Treppenläufer-Spirale

Eine bunte Spiralfeder läuft Stufe für Stufe hinunter: Ihre Windungen springen nacheinander im Bogen und stapeln sich auf der unteren Stufe.

Einstellungen

16px
1x

Code

<div class="uvq10-sly" role="status"><span class="sr">Wird geladen</span><div class="ly" aria-hidden="true"><i class="sp" style="--j:-2"></i><i class="sp" style="--j:-1"></i><i class="sp" style="--j:0"></i><i class="sp" style="--j:1"></i><i class="sp" style="--j:2"></i><i class="sp" style="--j:3"></i><i class="sp" style="--j:4"></i><i class="sp" style="--j:5"></i><i class="r r0"></i><i class="r r1"></i><i class="r r2"></i><i class="r r3"></i><i class="r r4"></i><i class="r r5"></i><i class="r r6"></i><i class="r r7"></i><i class="r r8"></i><i class="r r9"></i><i class="r r10"></i><i class="r r11"></i></div></div>

Prompt für KI

Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.

Markdown-Version mit dem ganzen Code, für KI-Assistenten

Mehr aus Loader

Alle ansehen: Loader

Wofür du ihn nutzen kannst

Zwölf Windungen, deren Farben zwischen den beiden Blockfarben gemischt sind, wandern auf beim Build berechneten Bögen von einer Stufe zur nächsten und überschlagen sich dabei, so dehnt sich die Feder zum Bogen und sammelt sich unten wieder. Die Treppe läuft mit und wiederholt sich, deshalb endet der Gang nie. Passt zu Spielzeugmarken, Kinderinhalten und Schrittprozessen.

Die Hauptfarbe bestimmt die oberen Windungen, die zweite die unteren, so wird die Feder regenbogenbunt, metallgrau oder markenfarbig. Nutze sie für Aufgaben in Etappen und lass seitlich etwas Rand, weil die Kanten ausblenden.