Inputs

Form inputs for data entry. Always include a label.

API Key

Found in your dashboard settings

Email

This doesn't look like a valid email

Product URL

Enter a full URL starting with https://

Usage

<div class="input-group">
  <label class="ds-input-label">Label</label>
  <input class="ds-input" placeholder="Placeholder text">
  <div class="ds-input-hint">Helpful hint text</div>
</div>

Rules

1. Border: --border, 1px
2. Label always above the input, never placeholder-only
3. Hint text below in --muted at 12px
4. Focus ring uses 3px offset, never blur