Home
$@(\/)(\/)¥
House Cleaning Website Services Section

House Cleaning Website Services Section

House Cleaning Website Services Section
Photo by @candjstudios & @framesforyourheart on Unsplash

This tailwind example is contributed by $@(\/)(\/)¥, on 15-Mar-2024. Component is made with Tailwind CSS v3. It is responsive. It supports dark mode. similar terms for this example are Services,Why choose us

Feature showcase

$$@(\/)(\/)¥ profile image$

Author $@(\/)(\/)¥

7.4k

Fork Fullscreen

<section class="w-full mx-auto py-10 bg-gray-50 dark:bg-gray-900 dark:text-white">
  
  <div
    class="w-fit pb-1 px-2 mx-4 rounded-md text-2xl font-semibold border-b-2 border-blue-600 dark:border-b-2 dark:border-yellow-600">
    Services</div>

<div class="md:w-[50%] w-full bg-gray-100 dark:bg-gray-900 dark:text-gray-400 md:p-4 p-0 rounded-md">
        <h2 class="text-3xl font-semibold text-gray-900 dark:text-white">Lorem ipsum dolor sit amet consectetur</h2>
        <p class="text-md mt-4">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Tempore placeat assumenda nam
          veritatis, magni doloremque pariatur quos fugit ipsa id voluptatibus deleniti officiis cum ratione eligendi
          sed necessitatibus aliquam error laborum delectus quaerat. Delectus hic error eligendi sed repellat natus fuga
          nobis tempora possimus ullam!</p>
      </div>

</div>
    
    <div
      class="xl:w-[80%] sm:w-[85%] w-[90%] mx-auto flex md:flex-row flex-col flex-col-reverse lg:gap-4 gap-2 justify-center lg:items-stretch md:items-center mt-6">
      
      <div class="md:w-[50%] w-full bg-gray-100 dark:bg-gray-900 dark:text-gray-400 md:p-4 p-0 rounded-md">
        <h2 class="text-3xl font-semibold text-gray-900 dark:text-white">Lorem ipsum dolor sit amet consectetur</h2>

<p class="text-md mt-4">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Tempore placeat assumenda nam
          veritatis, magni doloremque pariatur quos fugit ipsa id voluptatibus deleniti officiis cum ratione eligendi
          sed necessitatibus aliquam error laborum delectus quaerat. Delectus hic error eligendi sed repellat natus fuga
          nobis tempora possimus ullam!</p>
      </div>
      
      <img class="md:w-[50%] w-full md:rounded-t-lg rounded-sm" src="https://images.unsplash.com/photo-1516455590571-18256e5bb9ff?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w0NzEyNjZ8MHwxfHNlYXJjaHwxMXx8aG9tZXxlbnwwfDB8fHwxNzEwNDkwMDcwfDA&ixlib=rb-4.0.3&q=80&w=1080" alt="billboard image" />

</div>
  </div>
</section>

Related Examples

Product page
Product Information Card component that provides comprehensive details about a product, including an image, name, description, price, availability, color and size options, and a product description.

Author:
JaxStone

2 years ago

48.4k
Features list with images and description

Author:
Noah Schmidt

2 years ago

14.6k
Product Feature Section
present multiple product features in a grid layout. Each feature is represented by an icon, title, and description.

Author:
Elsabe Fourie

2 years ago

9.2k
Product feature showccase section with images

Author:
R.P Ketan

2 years ago

16.4k
Flour mill website landing page template
flour mill and services template website which comprise of many sections like about us, featured products, why us, visit us

Author:
Amit Pachange

1 year ago

14.6k
Feature showcase with images

Author:
Amit Pachange

2 years ago

13.9k
Onboarding steps section

Author:
Prashant

2 years ago

6.1k
Why choose us section
list your product features beautifully

Author:
Sameer Sultana

2 years ago

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

Author:
Arya

3 years ago

44.5k
Feature: Switch-Special
Here a special feature-showcase. I hope you like it ;)

Author:
Matti

1 year ago

1.6k
Features list with icons on top

Author:
Lina Lindström

2 years ago

9.8k
Features section
Showcase your key features

Author:
Manon Daniel

2 years ago

16.6k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components