Tailwind search bar

     <div class="pt-2 relative mx-auto text-gray-600">
        <input class="border-2 border-gray-300 bg-white h-10 px-5 pr-16 rounded-lg text-sm focus:outline-none"
          type="search" name="search" placeholder="Search">
        <button type="submit" class="absolute right-0 top-0 mt-5 mr-4">
          <svg class="text-gray-600 h-4 w-4 fill-current" xmlns="http://www.w3.org/2000/svg"
            xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px"
            viewBox="0 0 56.966 56.966" style="enable-background:new 0 0 56.966 56.966;" xml:space="preserve"
            width="512px" height="512px">
            <path
              d="M55.146,51.887L41.588,37.786c3.486-4.144,5.396-9.358,5.396-14.786c0-12.682-10.318-23-23-23s-23,10.318-23,23  s10.318,23,23,23c4.761,0,9.298-1.436,13.177-4.162l13.661,14.208c0.571,0.593,1.339,0.92,2.162,0.92  c0.779,0,1.518-0.297,2.079-0.837C56.255,54.982,56.293,53.08,55.146,51.887z M23.984,6c9.374,0,17,7.626,17,17s-7.626,17-17,17  s-17-7.626-17-17S14.61,6,23.984,6z" />
          </svg>
        </button>
      </div>

Source: tailwindcomponents.com

Similar codes

31 votes240 views5 answers
Ng if else
Html
38 votes224 views6 answers
Html iframe example
Html
0 vote210 views1 answer
Query dns
Html
3 votes223 views1 answer
Comentário html
Html
5 votes209 views1 answer
Video tag thumbnail
Html
0 vote233 views1 answer
Remove padding in code
Html
6 votes223 views10 answers
Array
Html
0 vote215 views1 answer
How to take input from user in html
Html
0 vote258 views1 answer
Table bootstrap dark
Html
5 votes237 views2 answers
Vue select v-for
Html