Hacemos quelas ideasse veany se usen
Konturschrift, die sich beim Scrollen füllt
Zeilen aus Konturschrift füllen sich beim Scrollen von links nach rechts mit Farbe, eine nach der anderen.
Einstellungen
Code
<div class="uv-tof"><div class="sc" tabindex="0" aria-label="Wir sorgen,"><div class="tr"><div class="st"><p><span style="--i:0">Wir sorgen,</span><span style="--i:1">dass Ideen</span><span style="--i:2">sichtbar sind</span><span style="--i:3">und genutzt werden</span></p></div></div></div><span class="hn" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M6 13l6 6 6-6"/></svg>Scrollen</span></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 Text & Scroll
Alle ansehen: Text & ScrollWofür du ihn nutzen kannst
Vier kurze Zeilen in kräftiger Schrift beginnen als dünne Konturen. Beim Scrollen füllt sich jede Zeile von links nach rechts mit voller Farbe, und die nächste startet erst, wenn die vorige fertig ist, sodass sich die Aussage im Takt deiner Hand liest. Jede zweite Zeile nutzt die zweite Farbe.
Die Füllung ist ein auf den Text zugeschnittener Hintergrund mit harter Kante, gesteuert von einer einzigen Fortschrittsvariable, das bleibt flüssig und sparsam. Es funktioniert im hellen und dunklen Modus, und Wörter, Farben und Tempo sind frei wählbar.