Search Input

inputs

CSS

HTML

<div class="input-wrapper">
  <svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
    <circle cx="11" cy="11" r="8" />
    <line x1="21" y1="21" x2="16.65" y2="16.65" />
  </svg>
  <input class="input" placeholder="Search..." />
</div>

Live Preview

Edit the CSS on the left to see live changes. The styles are scoped to the preview area.