Quadrado. Foco roxo. Sem pílula nunca.

Input é entrada de dado, não ação. Por isso é quadrado — diferente de botões e badges. Focus ring é halo roxo de 3px com border purple-400.

Form completo

Estados

Default: border hairline, fundo bg-elev levemente translúcido.
Focus: border purple-400 + halo de 3px rgba(116,39,212,0.20).
Disabled: opacity 0.5, cursor not-allowed.
Error: border error, mensagem em mono 0.7rem abaixo.

Microcopy obrigatória

Sempre acompanhar formulários com microcopy de transparência (em .e-eyebrow-dash): "Sem spam · Cancele quando quiser · LGPD-ready". Sem isso, o formulário quebra o tom de voz da marca.

Snippet · pronto pra colar

HTML · cole no seu projeto

<!-- Form vertical -->
<form class="form-grid" onsubmit="event.preventDefault();">
  <div>
    <label class="form-label" for="email">Seu e-mail</label>
    <input id="email" class="e-input" type="email" placeholder="[email protected]">
  </div>
  <div>
    <label class="form-label" for="msg">O que você está procurando?</label>
    <textarea id="msg" class="e-input e-textarea" placeholder="Conte um pouco sobre você..."></textarea>
  </div>
</form>

<!-- Form inline (newsletter) -->
<form class="form-row">
  <input class="e-input" type="email" placeholder="[email protected]">
  <button type="submit" class="e-btn e-btn-primary">Receber →</button>
</form>

<!-- Microcopy obrigatória abaixo do form -->
<span class="e-eyebrow-dash">
  <span class="e-dash-line"></span>
  <span>Sem spam · Cancele quando quiser · LGPD-ready</span>
</span>