Sample1

This tailwind example is contributed by Anuj Kamboj, on 05-Sep-2024. Component is made with Tailwind v3.4. It is responsive.

Select

Author Anuj Kamboj

Tailwind v3.4 140

Fork Fullscreen

<div class="flex flex-row flex-wrap p-4 rounded-md border-4 border-green-200  gap-4 ">
  <div class="w-32 h-32 bg-gray-500 rounded-md border-2 border-black text-2xl antialiased font-semibold flex items-center justify-center">
    A
  </div>
  <div class="w-32 h-32 bg-gray-500 rounded-md border-2 border-black text-2xl antialiased font-semibold flex items-center justify-center">
    B
  </div>
  <div class="w-32 h-32 bg-gray-500 rounded-md border-2 border-black text-2xl antialiased font-semibold flex items-center justify-center">
    C
  </div>
  <div class="w-32 h-32 bg-gray-500 rounded-md border-2 border-black text-2xl antialiased font-semibold flex items-center justify-center">
    D
  </div>
  <div class="w-32 h-32 bg-gray-500 rounded-md border-2 border-black text-2xl antialiased font-semibold flex items-center justify-center">
    E
  </div>
  <div class="w-32 h-32 bg-gray-500 rounded-md border-2 border-black text-2xl antialiased font-semibold flex items-center justify-center">
    F
  </div>
  <div class="w-32 h-32 bg-gray-500 rounded-md border-2 border-black text-2xl antialiased font-semibold flex items-center justify-center">
    G
  </div>
  <div class="w-32 h-32 bg-gray-500 rounded-md border-2 border-black text-2xl antialiased font-semibold flex items-center justify-center">
    H
  </div>
  <div class="w-32 h-32 bg-gray-500 rounded-md border-2 border-black text-2xl antialiased font-semibold flex items-center justify-center">
    I
  </div>
</div>

Related Examples

register
helps us to be learn easy

Nishimwe Jeanine

1 year ago

1.1k
Dropdown select on hover
this example does not uses javascript

Alok

3 years ago

31.4k
Select input

Sophia Baker

3 years ago

15.1k
canvas fully covers
canvas fully covers

ABDESLAMI ACHRAF

1 year ago

5.1k
Multi-Select Dropdown Filter with search
Interactive filtering component built with Alpine.js and Tailwind CSS, featuring searchable multi-select dropdowns with dynamic URL parameters. The system includes responsive design, real-time search functionality, and visual feedback through selected item tags that can be easily removed.

Anonymous

1 year ago

2.4k
Dropdown select on hover
this example does not uses javascript

Thomas Taylor

2 years ago

3.3k
Multi-Select Dropdown Filter with search
Interactive filtering component built with Alpine.js and Tailwind CSS, featuring searchable multi-select dropdowns with dynamic URL parameters. The system includes responsive design, real-time search functionality, and visual feedback through selected item tags that can be easily removed.

SANJAY SINGH GARIYA

1 year ago

2.3k
User List
List of users

Marcos Vinicios Nussemeyer

1 year ago

1.9k
Responsive portfolio with dark mode
responsive and support dark mode .portfolio website

ABDESLAMI ACHRAF

2 years ago

4.6k
Multi-Select Dropdown Filter with search
Interactive filtering component built with Alpine.js and Tailwind CSS, featuring searchable multi-select dropdowns with dynamic URL parameters. The system includes responsive design, real-time search functionality, and visual feedback through selected item tags that can be easily removed.

Maxim

1 year ago

7.1k
Pricing Plan Selector
radio buttons for selecting a pricing plan

Mehmet Kaplan

2 years ago

4.4k
Multiple select input with alpine js
select input where you can select multiple items

Nomusa Botha

2 years ago

7k

Browse by topic

Explore components by Tags

Jump straight to the UI pattern you need.

Footer Header Card Article Avatar FAQ Banner Blog Breadcrumb Button Call to Action Form Carousel Contact us Error page Feature Gallery Hero Input Spinner Login Modal Pagination Pricing Profile

Can't find it?

Didn't find the component you were looking for?

Search across 3,000+ community-built components and grab the code in seconds.