Home
Wagner Augusto
List example

List example

This tailwind example is contributed by Wagner Augusto, on 19-Sep-2024. Component is made with Tailwind CSS v3.

List

1.9k

<ul class="bg-white rounded-lg shadow divide-y divide-gray-200 w-full">
    <li class="px-6 py-4">
        <div class="flex justify-between">
            <span class="font-semibold text-lg">List Item 1</span>
            <span class="text-gray-500 text-xs">1 day ago</span>
        </div>
        <p class="text-gray-700">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in dui mauris.</p>
    </li>
    <li class="px-6 py-4">
        <div class="flex justify-between">
            <span class="font-semibold text-lg">List Item 2</span>
            <span class="text-gray-500 text-xs">2 days ago</span>
        </div>
        <p class="text-gray-700">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in dui mauris.</p>
    </li>
    <li class="px-6 py-4">
        <div class="flex justify-between">
            <span class="font-semibold text-lg">List Item 3</span>
            <span class="text-gray-500 text-xs">3 days ago</span>
        </div>
        <p class="text-gray-700">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in dui mauris.</p>
    </li>
</ul>
</div>

Related Examples

Order Delivered List

Author:
ABDO-SY

7 months ago

672
Minimal list section

Author:
Task Master

3 years ago

8.5k
Basic list

Author:
Leon Bachmann

3 years ago

10.3k
List example

Author:
Isabella Kowalski

2 years ago

14.2k
Features list with heading

Author:
Leon Bachmann

2 years ago

11.1k
List of links

Author:
Prajwal Hallale

2 years ago

10.2k
Feature List
Feature List Card (Responsive and supports Dark Mode)

Author:
Mr Robot

3 years ago

10.6k
Projects List

$$@(\/)(\/)¥$ Author:
$@(\/)(\/)¥

11 months ago

1.4k
Reusable Skill Showcase Section With Pure Tailwind CSS
A fully responsive and modular "Skills & Tools" section, perfect for any developer portfolio. Built with static HTML and Tailwind CSS, this component can be easily integrated into any project and made dynamic using any frontend framework (Vue, React, Svelte, Angular) or vanilla JavaScript. Customize it to highlight your unique tech stack and create engaging portfolio pages.

Author:
Abdul Baset Bappy

8 months ago

1.6k
Features list

Author:
Leon Bachmann

2 years ago

11k
Todo list in tailwlind

Author:
Kofi Osei

2 years ago

16.8k
Item List with title
created by using fieldset and legend tags

Author:
Prashant

3 years ago

11.2k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components