Home
Leon Bachmann
Features list

Features list

This tailwind example is contributed by Leon Bachmann, on 19-Jan-2023. Component is made with Tailwind CSS v3. It is responsive.

List

Author Leon Bachmann

11k

Fork Fullscreen

<div>
    <ul class="mt-8 space-y-3 font-medium">
        <li class="flex items-start lg:col-span-1">
            <div class="flex-shrink-0">
                <svg class="w-5 h-5 text-indigo-600" fill="currentColor" viewBox="0 0 20 20">
                    <path fill-rule="evenodd"
                        d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
                        clip-rule="evenodd"></path>
                </svg>
            </div>
            <p class="ml-3 leading-5 text-gray-600">
                Build functional APIs with zero coding.
            </p>
        </li>
        <li class="flex items-start mt-5 lg:col-span-1 lg:mt-0">
            <div class="flex-shrink-0">
                <svg class="w-5 h-5 text-indigo-600" fill="currentColor" viewBox="0 0 20 20">
                    <path fill-rule="evenodd"
                        d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
                        clip-rule="evenodd"></path>
                </svg>
            </div>
            <p class="ml-3 leading-5 text-gray-600">
                Resources with permissions.
            </p>
        </li>
        <li class="flex items-start mt-5 lg:col-span-1 lg:mt-0">
            <div class="flex-shrink-0">
                <svg class="w-5 h-5 text-indigo-600" fill="currentColor" viewBox="0 0 20 20">
                    <path fill-rule="evenodd"
                        d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
                        clip-rule="evenodd"></path>
                </svg>
            </div>
            <p class="ml-3 leading-5 text-gray-600">
                Built in user authentication.
            </p>
        </li>
        <li class="flex items-start mt-5 lg:col-span-1 lg:mt-0">
            <div class="flex-shrink-0">
                <svg class="w-5 h-5 text-indigo-600" fill="currentColor" viewBox="0 0 20 20">
                    <path fill-rule="evenodd"
                        d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
                        clip-rule="evenodd"></path>
                </svg>
            </div>
            <p class="ml-3 leading-5 text-gray-600">
                Easy Integration with existing apps and tools.
            </p>
        </li>
        <li class="flex items-start mt-5 lg:col-span-1 lg:mt-0">
            <div class="flex-shrink-0">
                <svg class="w-5 h-5 text-indigo-600" fill="currentColor" viewBox="0 0 20 20">
                    <path fill-rule="evenodd"
                        d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
                        clip-rule="evenodd"></path>
                </svg>
            </div>
            <p class="ml-3 leading-5 text-gray-600">
                Logs for your API calls.
            </p>
        </li>
    </ul>
</div>

Related Examples

Todo list template

Author:
Steven Kuhn

3 years ago

18.5k
Responsive list with icons

Author:
Prajwal Hallale

2 years ago

10.5k
Responsive list

Author:
Sienna

2 years ago

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

Author:
Mr Robot

3 years ago

10.6k
Features list with heading

Author:
Leon Bachmann

2 years ago

11.1k
Stacked list

Author:
Odessa Young

2 years ago

18.9k
Todo list in tailwlind

Author:
Kofi Osei

2 years ago

16.7k
List section
Beautiful list section with left border

Author:
Leon Bachmann

2 years ago

10.7k
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
List of steps

Author:
Leif99

2 years ago

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

Author:
Prajwal Hallale

2 years ago

20.2k
Table of content
Show list of Table of content

Author:
Anonymous

1 year ago

5.7k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components