Minimal list section

This tailwind example is contributed by Task Master, on 03-Nov-2022. Component is made with Tailwind v3.4. It is responsive.

List

Author Task Master

Tailwind v3.4 9.3k 14

Fork Fullscreen

<div>
    <span class="block mb-4 text-lg font-semibold tracking-wider text-gray-600">Companies</span>
    <nav class="flex flex-col space-y-3">
        <a href="#" class="text-gray-500 hover:text-indigo-500">
            Allstate Insurance
        </a>
        <a href="#" class="text-gray-500 hover:text-indigo-500">Tailwind
            State Farm Insurance
        </a>
        <a href="#" class="text-gray-500 hover:text-indigo-500">
            GEICO
            Insurance<span class="px-2 py-1 ml-2 text-xs font-semibold text-white uppercase bg-indigo-600 rounded-full">New</span>
        </a>
        <a href="#" class="text-gray-500 hover:text-indigo-500">
            Progressive Insurance
        </a>
        <a href="#" class="text-gray-500 hover:text-indigo-500">Tailwind
            American Family Insurance
        </a>
        <a href="#" class="text-gray-500 hover:text-indigo-500">Free Tailwind CSS
            USAA (United Services Automobile Association)
        </a>
    </nav>
</div>

Related Examples

Feature List

Laurits

4 years ago

11.3k
User list
User list

Anonymous

1 year ago

975
Responsive list with 3 columns

TailwindFlex

3 years ago

14.3k
Responsive list
Horizontal list of items

Sophia Baker

3 years ago

10.9k
ToDo

Im_angeo

5 months ago

520
Hierarchy list

Anonymous

3 years ago

11.5k
Responsive list with icons

Prajwal Hallale

3 years ago

10.6k
List example

Wagner Augusto

2 years ago

2.5k
Dropdown menu list
Dropdown menu list without using javascript. This example takes advantage of native HTML's <details> and <summary> tags

Prajwal Hallale

3 years ago

20.5k
Users ranking list

Leif99

3 years ago

17k
Table
Table with image and status with pagination buttons

Abhiraj

1 year ago

3k
Nested list

Lukas Müller

3 years ago

14.1k