Home
Fagundo67
Feature cards

Feature cards

This tailwind example is contributed by Fagundo67, on 05-Feb-2023. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are Services,Why choose us

Feature showcase Grid

Author Fagundo67

9.7k

Fork Fullscreen

<div class="bg-gray-100 min-h-screen p-4">
    <div class="container mx-auto pt-12 pb-20">
        <h1 class="text-4xl font-bold text-gray-800 text-center mb-8">
            Welcome to my website
        </h1>
        <p class="text-gray-700 text-lg text-center mb-12">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sit amet magna id ex hendrerit semper.
        </p>
        <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
            <div class="bg-white rounded-lg shadow-lg p-8">
                <h2 class="text-xl font-bold text-gray-800 mb-4">Services</h2>
                <p class="text-gray-700">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sit amet magna id ex hendrerit
                    semper.
                </p>
            </div>
            <div class="bg-white rounded-lg shadow-lg p-8">
                <h2 class="text-xl font-bold text-gray-800 mb-4">About Us</h2>
                <p class="text-gray-700">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sit amet magna id ex hendrerit
                    semper.
                </p>
            </div>
            <div class="bg-white rounded-lg shadow-lg p-8">
                <h2 class="text-xl font-bold text-gray-800 mb-4">Contact</h2>
                <p class="text-gray-700">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sit amet magna id ex hendrerit
                    semper.
                </p>
            </div>
        </div>
    </div>
</div>

Related Examples

Feature showcase cards

Author:
Lukas Müller

1 year ago

11.7k
Feature Showcase
The feature showcase's responsive grid can also be used as testimonial cards.

Author:
Alok

2 years ago

19.3k
Responsive Card Grid
Tailwind CSS responsive grid for feature listing. The cards have a teal background, rounded corners, and a concise display of feature titles, descriptions, and a "Learn More" link.

Author:
Amit Pachange

2 years ago

44.6k
Features grid

Author:
Sophia Baker

1 year ago

8.4k
Basic responsive card grid
supports dark mode

Author:
Samuel Dawson

1 year ago

10.1k
Tailwind image gallery
Responsive grid with evenly spaced image cards. Each card has a title label at the bottom, and there's a subtle hover effect for interactive engagement.

Author:
Alok

1 year ago

49.5k
Feature showcase with images

Author:
Amit Pachange

1 year ago

11.9k
Responsive Feature Card

Author:
Gopi Yadav

2 years ago

12k
Features cards section
Features cards section with dark theme

Author:
Sophia Baker

1 year ago

8.5k
Features section
Showcase your key features

Author:
Manon Daniel

1 year ago

13.9k
Why choose us section
list your product features beautifully

Author:
Sameer Sultana

1 year ago

23.5k
Responsive products grid
Responsive product card grid using tailwind CSS.

Author:
Arya

2 years ago

37k
Tailwind css feature cards

Author:
Kofi Osei

1 year ago

10k
Feature tiles

Author:
Nishant Trivedi

1 year ago

11.3k
Feature display cards (grid layout)

Author:
Sophia Baker

1 year ago

13.2k

Explore components by Tags

Didn't find component you were looking for?

Search from 1800+ components