Input

Source: Uiverse ↗
Author: fbernack
Licence: MIT

Loading…

Code

<div class="mat-input">
  <label for="food">Favorite food</label>
  <input id="food" type="text" placeholder="Ex. Pizza" />
</div>

Prompt

Build "Input", a input animation. Write it as plain HTML and CSS: one container element and a stylesheet, no JavaScript unless it is essential. It sits on a light background, in a 16:10 frame. Respect prefers-reduced-motion with a still state, pause work when the element is off screen, and keep it accessible. Original: https://uiverse.io/fbernack/honest-bat-69 (fbernack, MIT).