images

This tailwind example is contributed by Maxim, on 31-Jan-2024. Component is made with Tailwind v3.4. It is responsive.

Banner

Author Maxim

Tailwind v3.4 3.9k 14

Fork Fullscreen

<div class="grid lg:grid-cols-2 gap-3">
	  <div class="grid grid-cols-2 lg:grid-cols-1 gap-3">
		<figure class="relative w-full h-60">
		  <img class="w-full h-full absolute top-0 start-0 object-cover rounded-xl" src="https://images.unsplash.com/photo-1670272505340-d906d8d77d03?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2070&q=80" alt="Image Description">
		</figure>
		<figure class="relative w-full h-60">
		  <img class="w-full h-full absolute top-0 start-0 object-cover rounded-xl" src="https://images.unsplash.com/photo-1671726203638-83742a2721a1?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2070&q=80" alt="Image Description">
		</figure>
	  </div>
	  <figure class="relative w-full h-72 sm:h-96 lg:h-full">
		<img class="w-full h-full absolute top-0 start-0 object-cover rounded-xl" src="https://images.unsplash.com/photo-1671726203394-491c8b574a0a?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=988&q=80" alt="Image Description">
	  </figure>
	</div>

Related Examples

Welcome banner for developers portfolio
A hero section welcoming visitors to a portfolio or website. It features a large, visually appealing title and an image.

Vikram Choudhary

3 years ago

11.8k
Black friday sale / deal banner

Conan Hilton

3 years ago

11.4k
cards
cards slices

Anonymous

2 years ago

7.7k
CTA banner
Capture the attention of the user with full-width CTA Section

Anonymous

2 years ago

5.1k
Hero section with large image
Hero section with large image

Emdadul Islam

2 years ago

5.3k
Acode Master
Acode Master is a skilled and passionate software developer known for mastering coding and creating innovative tech solutions. Specializing in modern web technologies like React.js, Node.js, PHP, and databases such as MySQL and PostgreSQL, Acode Master builds practical, efficient, and scalable applications. Beyond coding, Acode Master is dedicated to continuous learning, sharing knowledge, and empowering others through technology-driven projects and education.

Code Master(Mfuranziza Dusabe Hamza)

1 year ago

2.3k
Food App Web design

Aitrik Saha

1 year ago

2.5k
SocialSphere: A Full-Stack Social Media Platform
SocialSphere is a full-stack social media platform inspired by Facebook, built using HTML CSS

Code Master(Mfuranziza Dusabe Hamza)

1 year ago

1.5k
Banner - Hero - Splash Section

ABDO-SY

1 year ago

1.9k
Banner for app download
Show App Download Buttons for the App Store and Play Store

Pixel Perfect

2 years ago

2.1k
Stats Banner Example
Show your stats proudly

Nomusa Botha

2 years ago

2.9k
Modern SAAS Hero Section
A 2-column responsive hero section for modern SAAS APP

Emdadul Islam

2 years ago

5.9k

Browse by topic

Explore components by Tags

Jump straight to the UI pattern you need.

Footer Header Card Article Avatar FAQ Banner Blog Breadcrumb Button Call to Action Form Carousel Contact us Error page Feature Gallery Hero Input Spinner Login Modal Pagination Pricing Profile

Can't find it?

Didn't find the component you were looking for?

Search across 3,000+ community-built components and grab the code in seconds.