Koala logo Design
No matches for “”
↑↓ navigate ↵ open Esc close
BrochureInput action

Input action

A pill input with its pill button sitting inside it, for a one-field form like a waitlist or a contact email.

<koala-input-action>

Email and button

Put the input first, in its own wrapper, and the button second. The pair shares one pill outline: the input loses its own border and fill, the button sits inside with a small gutter, and focus rings the whole pill. On phones the button keeps its place in the pill and shows only its icon, its label still read out.

API

class merged onto the pill, e.g. mt-6
children an input in a wrapper, then a koala-button