Home
Laurits
Feature List

Feature List

This tailwind example is contributed by Laurits, on 03-Oct-2022. Component is made with Tailwind CSS v3. It is responsive.

List

Author Laurits

10.4k

Fork Fullscreen

<div>
    <h1 class="font-bold text-xl text-green-900">Feature List</h1>
    <ul class="mt-3 flex flex-col space-y-2">
        <li class="flex"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
                stroke="currentColor" aria-hidden="true" class="mr-2 h-auto w-6 text-green-600 sm:w-7">
                <path stroke-linecap="round" stroke-linejoin="round"
                    d="M9 12.75L11.25 15 15 9.75M21 12c0 1.268-.63 2.39-1.593 3.068a3.745 3.745 0 01-1.043 3.296 3.745 3.745 0 01-3.296 1.043A3.745 3.745 0 0112 21c-1.268 0-2.39-.63-3.068-1.593a3.746 3.746 0 01-3.296-1.043 3.745 3.745 0 01-1.043-3.296A3.745 3.745 0 013 12c0-1.268.63-2.39 1.593-3.068a3.745 3.745 0 011.043-3.296 3.746 3.746 0 013.296-1.043A3.746 3.746 0 0112 3c1.268 0 2.39.63 3.068 1.593a3.746 3.746 0 013.296 1.043 3.746 3.746 0 011.043 3.296A3.745 3.745 0 0121 12z">
                </path>
            </svg>
            <p class="text-base text-slate-700 sm:text-lg">30 seconds to setup</p>
        </li>
        <li class="flex"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
                stroke="currentColor" aria-hidden="true" class="mr-2 h-auto w-6 text-green-600 sm:w-7">
                <path stroke-linecap="round" stroke-linejoin="round"
                    d="M9 12.75L11.25 15 15 9.75M21 12c0 1.268-.63 2.39-1.593 3.068a3.745 3.745 0 01-1.043 3.296 3.745 3.745 0 01-3.296 1.043A3.745 3.745 0 0112 21c-1.268 0-2.39-.63-3.068-1.593a3.746 3.746 0 01-3.296-1.043 3.745 3.745 0 01-1.043-3.296A3.745 3.745 0 013 12c0-1.268.63-2.39 1.593-3.068a3.745 3.745 0 011.043-3.296 3.746 3.746 0 013.296-1.043A3.746 3.746 0 0112 3c1.268 0 2.39.63 3.068 1.593a3.746 3.746 0 013.296 1.043 3.746 3.746 0 011.043 3.296A3.745 3.745 0 0121 12z">
                </path>
            </svg>
            <p class="text-base text-slate-700 sm:text-lg">Easy to use</p>
        </li>
        <li class="flex"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
                stroke="currentColor" aria-hidden="true" class="mr-2 h-auto w-6 text-green-600 sm:w-7">
                <path stroke-linecap="round" stroke-linejoin="round"
                    d="M9 12.75L11.25 15 15 9.75M21 12c0 1.268-.63 2.39-1.593 3.068a3.745 3.745 0 01-1.043 3.296 3.745 3.745 0 01-3.296 1.043A3.745 3.745 0 0112 21c-1.268 0-2.39-.63-3.068-1.593a3.746 3.746 0 01-3.296-1.043 3.745 3.745 0 01-1.043-3.296A3.745 3.745 0 013 12c0-1.268.63-2.39 1.593-3.068a3.745 3.745 0 011.043-3.296 3.746 3.746 0 013.296-1.043A3.746 3.746 0 0112 3c1.268 0 2.39.63 3.068 1.593a3.746 3.746 0 013.296 1.043 3.746 3.746 0 011.043 3.296A3.745 3.745 0 0121 12z">
                </path>
            </svg>
            <p class="text-base text-slate-700 sm:text-lg">Generous free-tier</p>
        </li>
    </ul>
</div>

Related Examples

Features list with heading

Author:
Leon Bachmann

2 years ago

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

Author:
Mr Robot

3 years ago

10.5k
Item List

Author:
Amit Pachange

3 years ago

9.8k
Twitter like users list

Author:
Simon Scheffer

2 years ago

11.6k
Items list
list in fieldset

Author:
Prajwal Hallale

3 years ago

9.3k
Logo cloud

Author:
Alok

2 years ago

10.3k
Bullet points list
for sections like "Why Choose Us"

Author:
Orson Kincaid

1 year ago

1.6k
Services list

Author:
ariaw

2 weeks ago

16
Todo List with Dark theme
Todo List with Dark theme

Author:
Muzammil Riaz

5 months ago

643
List example

Author:
Wagner Augusto

1 year ago

1.8k
List with highlighted text

Author:
Amit Pachange

2 years ago

9.8k
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

7 months ago

1.4k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components