HTML + CSSLoader

Füllende Welle

Ein rundes Glas, das sich mit einer sanft rollenden Welle füllt, bis es voll ist, und dann von vorn beginnt.

Einstellungen

72px
1x

Code

<div class="ul-wv"></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.

Mehr aus Loader

Wofür du ihn nutzen kannst

Auffüllen ist eine Metapher, die jeder versteht: Wasser im Glas, Ladung im Akku, Kaffee in der Tasse. Nutze diesen Liquid-Fill-Loader in einem Trink-Tracker, auf dem Ladebildschirm einer E-Auto-App oder während die Bestellseite eines Cafés dein Getränk zubereitet. Zwei Wellenschichten rollen unterschiedlich schnell, dadurch wirkt die Oberfläche lebendig.

Gib ihm Platz in mittlerer oder großer Größe, damit die Welle zu sehen ist. Eine kurze Zeile darunter wie „Dein Kaffee wird zubereitet“ macht aus einem beliebigen Spinner einen kleinen Moment. Die zweite Farbe liegt hinter der ersten, ein hellerer Ton der Hauptfarbe passt gut.