Tailwind CSS Gallery

Use Tailwind CSS gallery component with a different grid layout. To display multiple images in different styles using Tailwind CSS flex and grid classes.

Documentation Get figma file Switch to Old UI

Gallery section with testimonial

This example shows gallery in na testimonial manner with images and CTA button to scroll testimonial.

Gallery section image with lightbox

These tailwind CSS Gallery section used to heading, image layout with slider and lightbox.

Gallery section with transform image

These tailwind CSS Gallery section used to heading and transform image layout with slider.

Gallery section with Innovation

These tailwind CSS Gallery section used to grid style with image overlay and lightbox effect.

Gallery section with lightbox effect

These tailwind CSS Gallery section used to grid style with image overlay and lightbox effect.

Gallery section with vertical slider

These tailwind CSS Gallery section used to grid layout with vertical slider.

Gallery section with slider

These tailwind CSS Gallery section used to heading and grid layout with swiper slider.

Gallery section with masonary layout

These tailwind CSS Gallery section used to grid style with overlay and lightbox effect.

Gallery section with tab content

These tailwind CSS Gallery section used to grid style with tab content.

gallery section with lightbox effect

These tailwind CSS Gallery section used to grid style and hover effect with overlay and lightbox.

Gallery section with scale effect

These tailwind CSS Gallery section used to heading, paragraph with image scale and lightbox effect.

Gallery section with overlay effect

These tailwind CSS Gallery section used to heading, paragraph and grid layout with overlay image.

Gallery section with autoplay slider

These tailwind CSS Gallery section used to heading and autoplay slider.

Gallery section with grid and overlay effect

These tailwind CSS Gallery section used to grid style and overlay effect.

Gallery section with overlay image

These tailwind CSS Gallery section used to slider with image overlay.

Gallery section with pagination

These tailwind CSS Gallery section used to pagination as a slider and lightbox image layout.

Gallery section with lightbox image

These tailwind CSS Gallery section used to heading and navigation image for slider.

Gallery section with grid layout

These tailwind CSS Gallery section used to heading and grid layout image with Lightbox.