KI-Eingabefeld für Prompts
Ein mitwachsendes Textfeld mit rotierendem Lichtrand beim Tippen, Schnellaktionen und Senden-Button.
Einstellungen
Code
<form class="uv-iai"><label class="bx"><span class="sr">Frag, was du willst</span><textarea rows="1" placeholder="Frag, was du willst"></textarea></label><div class="rw"><button type="button" class="ch">Zusammenfassen</button><button type="button" class="ch">Übersetzen</button><button type="button" class="ch">Ideen</button><button type="submit" class="go" aria-label="Senden"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 19V5M5.5 11.5L12 5l6.5 6.5"/></svg></button></div></form>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
Alle ansehen: EingabefelderWofür du ihn nutzen kannst
Chat- und Assistenten-Oberflächen drehen sich um ein einziges Feld, es verdient also Sorgfalt. Diese Box wächst mit dem Text, zeigt im Fokus einen rotierenden Verlaufsrand und ein sanftes Leuchten und bietet drei Chips, die eine Anweisung vorausfüllen. Der runde Senden-Button bleibt grau, solange das Feld leer ist, und wird farbig, sobald es etwas zu senden gibt.
Passt zu KI-Schreibtools, Support-Chats, Suche in natürlicher Sprache und internen Assistenten. Die Textarea ist ein echtes Formularfeld, und der animierte Rand stoppt bei reduzierter Bewegung.