tailwindcomponents.com Open in urlscan Pro
2a06:98c1:3120::3  Public Scan

Form analysis
4 forms found in the DOM

/search

<form action="/search" class="flex flex-wrap justify-between md:flex-row"><input type="search" name="query" placeholder="Search" required="required"
    class="w-full h-12 px-4 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg xl:transition-all xl:duration-200 xl:w-24 xl:focus:w-28 2xl:w-32 2xl:focus:w-44 xl:h-10 dark:bg-gray-900 dark:text-gray-300 dark:border-gray-600 focus:border-primary dark:focus:border-primary focus:outline-none focus:ring focus:ring-primary dark:placeholder-gray-400 focus:ring-opacity-20">
</form>

/search

<form action="/search" class="flex flex-wrap justify-between md:flex-row"><input type="search" name="query" placeholder="Search" required="required"
    class="w-full h-12 px-4 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg xl:transition-all xl:duration-200 xl:w-24 xl:focus:w-28 2xl:w-32 2xl:focus:w-44 xl:h-10 dark:bg-gray-900 dark:text-gray-300 dark:border-gray-600 focus:border-primary dark:focus:border-primary focus:outline-none focus:ring focus:ring-primary dark:placeholder-gray-400 focus:ring-opacity-20">
</form>

POST /component/button-with-loader/favorites

<form action="/component/button-with-loader/favorites" method="post"><input type="hidden" name="_token" value="8ymK3GNVANSxMiJvkaA7KCLRsHa43iNQORL2ykuI"> <button type="submit"
    class="flex items-center justify-center w-full px-4 py-2 space-x-2 text-gray-600 transition-colors duration-300 transform border rounded-lg lg:w-auto dark:text-gray-200 dark:border-gray-200 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none"><svg
      xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-5 h-5">
      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"></path>
    </svg> <span>Favorite <span class="inline-flex items-center justify-center px-2 py-1 text-xs bg-gray-200 rounded-full dark:bg-gray-700">5</span></span></button></form>

POST /component/button-with-loader/download

<form action="/component/button-with-loader/download" method="post"><input type="hidden" name="_token" value="8ymK3GNVANSxMiJvkaA7KCLRsHa43iNQORL2ykuI"> <button type="submit"
    class="flex items-center px-4 py-2 space-x-3 text-gray-600 transition-colors duration-300 transform border rounded-lg focus:border-teal-500 focus:ring focus:ring-primary focus:ring-opacity-40 dark:text-gray-200 dark:border-gray-200 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none"><svg
      xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-5 h-5">
      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"></path>
    </svg> <span class="hidden md:inline">Download</span></button></form>

Text Content

tailwindcomponents


Components
All Components
awesome 69 Accordions 5 Alerts 17 Alpinejs 85 Avatars 9 Badges 3 Breadcrumb 4
Buttons 389 Cards 661 Carousel 4 Checkbox 8 Cursor 0 Dashboard 18 Datepicker 3
Dropdowns 27 Footers 13
awesome 69 Forms 363 Grid 8 Headers 17 Icons 89 Images 5 Inputs 134 Kit 3 Layout
31 Logins 112 Menu 12 Modals 43 Navbars 17 Navigations 280 Pages 621 Pagination
9
awesome 69 Popover 2 Pricing 13 Progress 7 Selects 13 Shadows 1 Sidebar 31
Spinner 5 Switch 6 Tables 57 Tabs 21 Timeline 7 Tooltip 4 Typography 7 Widget
733
Components Premium cheatsheet gradient generator
Ecosystem
Material Tailwind Tailwind UI/UX Course Custom Development
Blog

Submit Login
Components
All Components
awesome 69 Accordions 5 Alerts 17 Alpinejs 85 Avatars 9 Badges 3 Breadcrumb 4
Buttons 389 Cards 661 Carousel 4 Checkbox 8 Cursor 0 Dashboard 18 Datepicker 3
Dropdowns 27 Footers 13
awesome 69 Forms 363 Grid 8 Headers 17 Icons 89 Images 5 Inputs 134 Kit 3 Layout
31 Logins 112 Menu 12 Modals 43 Navbars 17 Navigations 280 Pages 621 Pagination
9
awesome 69 Popover 2 Pricing 13 Progress 7 Selects 13 Shadows 1 Sidebar 31
Spinner 5 Switch 6 Tables 57 Tabs 21 Timeline 7 Tooltip 4 Typography 7 Widget
733
Components Premium cheatsheet gradient generator
Ecosystem
Material Tailwind Tailwind UI/UX Course Custom Development
Blog

Submit Login
tailwindcss@3.0.18


TAILWIND CSS BUTTON WITH LOADER

By Anonymous

Button with Loader made using Tailwind CSS

Fork
Favorite 5

React Components Library

Material Tailwind

Get Started
xssmmdlgxl
Full screen Preview
Download
Show Code



Anonymous
0 component Profile On

COMMUNITY RATE


5 from 1 ratings


RELATED COMPONENTS

Tailwind CSS Button Purple - Text Creative Tim
3.0
0
Toggle r-freeman
1.2
10
Tailwind CSS Button Teal - Round with icon Anonymous
3.0
0
Badge killgt
1.2
3
Tailwind CSS Outline Buttons with Transition zaadevofc
3.0
3
Tailwind CSS Button Indigo - Round with text Anonymous
3.0
0
See more components

tailwindcomponents

© 2023 Tailwind Components Sponsored by Creative Tim. Component copyrights
belongs to their authors.

Privacy Legal Cookies

Your new development career awaits. Check out the latest listings.ads via Carbon