Farbiges schwebendes Label
Das Label sitzt im Feld und schwebt beim Tippen kleiner und farbig an den oberen Rand.
Einstellungen
Code
<label class="uv-if"><input placeholder=" "><span>E-Mail</span></label>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 Eingabefelder
Wofür du ihn nutzen kannst
Ein Eingabefeld mit Floating Label hält Formulare kompakt, ohne dass die Beschriftung beim Tippen verschwindet, wie es beim normalen Platzhalter passiert. Es passt zu einem Login-Screen, zur Lieferadresse im Checkout oder zum Kontaktformular einer Zahnarztpraxis. Klickst du hinein, gleitet das Label nach oben, wird kleiner und nimmt deine Hauptfarbe an.
Am meisten bringt es auf dem Handy, wo der Platz in der Höhe knapp ist. Halte die Labels bei ein, zwei Wörtern, denn sie schrumpfen auf drei Viertel. Bei langen Fragen liest sich eine normale Beschriftung über dem Feld besser.