Home
Htmlwind
Logo cloud - Htmlwind

Logo cloud - Htmlwind

Grid logo cloud

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

Logo cloud

Author Htmlwind

183

Fork Fullscreen

<div class="bg-white py-24 sm:py-32">
  <div class="mx-auto max-w-7xl sm:px-6 lg:px-8">
    <h2 class="mx-auto max-w-2xl px-6 text-center text-xl font-semibold leading-8 tracking-tight text-gray-900 sm:px-0">Trusted by companies across the globe</h2>
    <div class="mt-8 grid grid-cols-2 gap-1 overflow-hidden sm:grid-cols-4 sm:rounded-2xl lg:grid-cols-6">
      <div class="flex items-center justify-center bg-gray-500/5 p-8">
        <img class="max-h-12 w-full object-contain" src="https://htmlwind.com/assets/images/logo/logoipsum-214.svg" alt="Logoipsum" />
      </div>
      <div class="flex items-center justify-center bg-gray-500/5 p-8">
        <img class="max-h-12 w-full object-contain" src="https://htmlwind.com/assets/images/logo/logoipsum-221.svg" alt="Logoipsum" />
      </div>
      <div class="flex items-center justify-center bg-gray-500/5 p-8">
        <img class="max-h-12 w-full object-contain" src="https://htmlwind.com/assets/images/logo/logoipsum-216.svg" alt="Logoipsum" />
      </div>
      <div class="flex items-center justify-center bg-gray-500/5 p-8">
        <img class="max-h-12 w-full object-contain" src="https://htmlwind.com/assets/images/logo/logoipsum-317.svg" alt="Logoipsum" />
      </div>
      <div class="flex items-center justify-center bg-gray-500/5 p-8">
        <img class="max-h-12 w-full object-contain" src="https://htmlwind.com/assets/images/logo/logoipsum-284.svg" alt="Logoipsum" />
      </div>
      <div class="flex items-center justify-center bg-gray-500/5 p-8">
        <img class="max-h-12 w-full object-contain" src="https://htmlwind.com/assets/images/logo/logoipsum-311.svg" alt="Logoipsum" />
      </div>
      <div class="flex items-center justify-center bg-gray-500/5 p-8">
        <img class="max-h-12 w-full object-contain" src="https://htmlwind.com/assets/images/logo/logoipsum-288.svg" alt="Logoipsum" />
      </div>
      <div class="flex items-center justify-center bg-gray-500/5 p-8">
        <img class="max-h-12 w-full object-contain" src="https://htmlwind.com/assets/images/logo/logoipsum-263.svg" alt="Logoipsum" />
      </div>
      <div class="flex items-center justify-center bg-gray-500/5 p-8">
        <img class="max-h-12 w-full object-contain" src="https://htmlwind.com/assets/images/logo/logoipsum-220.svg" alt="Logoipsum" />
      </div>
      <div class="flex items-center justify-center bg-gray-500/5 p-8">
        <img class="max-h-12 w-full object-contain" src="https://htmlwind.com/assets/images/logo/logoipsum-211.svg" alt="Logoipsum" />
      </div>
      <div class="flex items-center justify-center bg-gray-500/5 p-8">
        <img class="max-h-12 w-full object-contain" src="https://htmlwind.com/assets/images/logo/logoipsum-329.svg" alt="Logoipsum" />
      </div>
      <div class="flex items-center justify-center bg-gray-500/5 p-8">
        <img class="max-h-12 w-full object-contain" src="https://htmlwind.com/assets/images/logo/logoipsum-325.svg" alt="Logoipsum" />
      </div>
    </div>
  </div>
</div>

Related Examples

Brand Grid with Hover Effect

Author:
ᴀʀ!ᴀ

3 months ago

644
Sponsors section
icon grid

Author:
Sienna

2 years ago

12.2k
Applications Showcase
This is a stylish and interactive application showcase component designed for web use. It features the following elements: Background Styling: The main container has a rounded-rectangle shape (rounded-3xl) with a subtle white base overlaying a high-resolution background image, styled with background-size: 600px for an artistic touch. The image itself dynamically serves as a backdrop, giving the component a layered appearance. Main Icon: A small circular icon, located at the top-right corner, appears with smooth hover effects: Enlarges to double its size (scale-[2]). Rotates (rotate-[410deg]). Moves diagonally upwards-right (translate-x-3, -translate-y-3). These transitions occur over a duration of 1 second (transition duration-1000). Overlay Gradient: A transparent gradient overlay (bg-gradient-to-l) adds a polished depth effect, transitioning from black (from-black/80) to lighter shades. App Icon and Info: Icon: The app icon is a smaller, bordered square image (rounded-2xl) with hover shrink animations (group-hover:scale-95). Text: A bold application title (text-md font-semibold) with hover-animated underline effects that gradually expand from left to right. A short app description styled as secondary text. Call-to-Action Button: Below the card is a subtle, rounded button (rounded-full) encouraging interaction. It features: A hover effect with color inversion (gray to black). A lift effect (hover:-translate-y-1) when hovered. This component is perfect for modern app showcases, offering a dynamic, user-friendly visual experience. It ensures a professional look while engaging users through smooth animations and clear calls to action.

Author:
Banshee

7 months ago

1.7k
Brand icons grid
showcase your 'Happy Customers'.

Author:
Kennedy Mills

2 years ago

10.6k
Social Media Icons
Social Media Icons

Author:
Aman kumar

1 year ago

1.4k
icon
icon

Author:
Aman kumar

1 year ago

2.2k
ACODE,ASTER
love my projuct

Author:
Code Master(Mfuranziza Dusabe Hamza)

1 month ago

225
Company icons grid

Author:
Amit Pachange

2 years ago

12.5k
Company Logos Showcase
Client showcase with icons

Author:
Brandon D

2 years ago

11.8k
Logo Cloude

Author:
Abdul Baset Bappy

3 weeks ago

28
Marquee Slider of Client Logos – Smooth Scrolling Brand Showcase
Enhance your website's credibility with a sleek marquee slider displaying client logos. This continuously scrolling slider provides a dynamic and engaging way to showcase your trusted partnerships, ensuring a professional and visually appealing design. Perfect for businesses, portfolios, and service-based websites.

Author:
M Junaid

2 weeks ago

119
Logo cloud

Author:
Alok

2 years ago

9.9k

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components