Search

<div class="search">
  <div class="search__wrapper">
    <form class="" action="index.html" method="post">

      <div class="form-field form-field--input form-field--search">
        <label for="name-here" class="hidden">Search</label>
        <input type="text" name="value-here" placeholder="value-here" id="name-here">
      </div>

      <button class="icon-button icon-button--search">
        <i class="material-icons">search</i>
      </button>

    </form>
  </div>
</div>

Search with toggle show/hide for responsive

<div class="search search--header">
  <div class="search__wrapper search__wrapper--header"  id="toggle-search">
    <form class="" action="index.html" method="post">

      <div class="form-field form-field--input form-field--search">
        <label for="name-here" class="hidden">Search</label>
        <input type="text" name="value-here" placeholder="value-here" id="name-here">
      </div>

      <button class="icon-button icon-button--search">
        <i class="material-icons">search</i>
      </button>

      <div onclick="toggle_visibility('toggle-search');" id="search-button">
        <i class="material-icons search-open">search</i>
        <i class="material-icons search-close">close</i>
      </div>

    </form>
   </div>
</div>