Home
Maxim
Logos cards

Logos cards

This tailwind example is contributed by Maxim, on 02-Jan-2025. Component is made with Tailwind CSS v3. It is responsive.

Card

Author Maxim

1.2k

Fork Fullscreen

<div class="grid grid-cols-2 sm:grid-cols-2 lg:grid-cols-4 sm:gap-2 gap-4 auto-cols-fr my-2">
    <a
        href="https://lqrs.com/brands/heineken/?utm_source=q&amp;utm_medium=cpc&amp;utm_campaign=brand&amp;utm_term=Heineken"
        class="flex flex-col items-center justify-center p-4 bg-white border border-2 border-gray-200 hover:border-rose-600 rounded-2xl group transition-colors min-h-[120px] transition-all duration-300"
    >
        <div class="mb-2 w-32 aspect-square flex items-center justify-center">
            <img class="max-w-full max-h-full object-contain" src="https://lqrs.com/site/assets/files/62390/heineken-logo.320x0.png" alt="Heineken logo" />
        </div>
        <h5 class="text-center text-lg sm:text-base font-medium text-gray-900 group-hover:text-rose-600">
            Heineken
        </h5>
    </a>
    <a
        href="https://lqrs.com/brands/budweiser/?utm_source=q&amp;utm_medium=cpc&amp;utm_campaign=brand&amp;utm_term=Budweiser"
        class="flex flex-col items-center justify-center p-4 bg-white border border-2 border-gray-200 hover:border-rose-600 rounded-2xl group transition-colors min-h-[120px] transition-all duration-300"
    >
        <div class="mb-2 w-32 aspect-square flex items-center justify-center">
            <img class="max-w-full max-h-full object-contain" src="https://lqrs.com/site/assets/files/62391/budweiser-logo.320x0.png" alt="Budweiser logo" />
        </div>
        <h5 class="text-center text-lg sm:text-base font-medium text-gray-900 group-hover:text-rose-600">
            Budweiser
        </h5>
    </a>
    <a
        href="https://lqrs.com/brands/carlsberg/?utm_source=q&amp;utm_medium=cpc&amp;utm_campaign=brand&amp;utm_term=Carlsberg"
        class="flex flex-col items-center justify-center p-4 bg-white border border-2 border-gray-200 hover:border-rose-600 rounded-2xl group transition-colors min-h-[120px] transition-all duration-300"
    >
        <div class="mb-2 w-32 aspect-square flex items-center justify-center">
            <img class="max-w-full max-h-full object-contain" src="https://lqrs.com/site/assets/files/15605/carlsberg-logo.320x0.png" alt="Carlsberg logo" />
        </div>
        <h5 class="text-center text-lg sm:text-base font-medium text-gray-900 group-hover:text-rose-600">
            Carlsberg
        </h5>
    </a>
    <a
        href="https://lqrs.com/brands/stella-artois/?utm_source=q&amp;utm_medium=cpc&amp;utm_campaign=brand&amp;utm_term=Stella Artois"
        class="flex flex-col items-center justify-center p-4 bg-white border border-2 border-gray-200 hover:border-rose-600 rounded-2xl group transition-colors min-h-[120px] transition-all duration-300"
    >
        <div class="mb-2 w-32 aspect-square flex items-center justify-center">
            <img class="max-w-full max-h-full object-contain" src="https://lqrs.com/site/assets/files/62394/stella-artois-logo.320x0.png" alt="Stella Artois logo" />
        </div>
        <h5 class="text-center text-lg sm:text-base font-medium text-gray-900 group-hover:text-rose-600">
            Stella Artois
        </h5>
    </a>
</div>

Related Examples

Profile card
tailwind Profile Card

Author:
Md. Tofayel islam

1 year ago

2.6k
Monkey card
First tailwind example

Author:
muhittin budak

5 months ago

419
Experince Section

Author:
ABDO-SY

7 months ago

761
Personal card
A card to show minimal info for staff member

Author:
farid

8 months ago

712
Food Ordering Dashboard
A responsive user interface for selecting and ordering your favorite meals. The dashboard allows users to browse food categories, view dish details, and place orders with ease.

Author:
Muhammad Umair Arshad

4 months ago

600
Contact us Form with Responsive

Author:
KULDEEP

2 months ago

310
Subcribe Card - Alert - Notification

Author:
ABDO-SY

7 months ago

557
Profit Card
Profit card with deatils

Author:
dongol heart

10 months ago

1.5k
google meet clone
Meeting application with fully responsive connect my web for jsx https://abhirajk.vercel.app/

Author:
Abhiraj

8 months ago

1.1k
Gradient card

Author:
TailwindFlex

2 years ago

8.9k
Weather info Card
Inspired from Mamba UI

Author:
Ron Hicks

3 years ago

11.9k
Elevated feature card

Author:
magersa

1 year ago

4k

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components