Call to action

slightly tilted call to action section

This tailwind example is contributed by Simon Scheffer, on 07-Dec-2022. Component is made with Tailwind v3.4. It is responsive. similar terms for this example are CTA,banner,find

Call to Action Search Bar

Author Simon Scheffer

Tailwind v3.4 11.9k 12

Fork Fullscreen

<section class="mt-12 lg:mt-24">
    <div class="bg-teal-500 text-white -skew-y-1">
        <div class="container mx-auto skew-y-1">
            <div class="flex flex-col items-center py-10 text-center lg:py-20">
                <div class="w-full px-4 lg:w-1/2 lg:px-0">
                    <div class="mb-8">
                        <h2 class="text-3xl lg:text-4xl font-bold mb-3">
                            Looking for a solution?
                        </h2>
                        <p class="text-lg lg:text-xl opacity-80">
                            Search the forum for the answer to your question
                        </p>
                    </div>

<div class="text-lg">
                        <p>
                            Can't find what you're looking for?<br class="sm:hidden">
                            <a href="#" class="border-b border-white pb-1">
                                Create a new thread
                            </a>
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

Related Examples

Search bar

Arya

3 years ago

33k
Search bar with filter options

Piet Vriend

3 years ago

26.5k
Large search bar with icon

Prajwal Hallale

4 years ago

10.5k
Call to action section

Odessa Young

3 years ago

13.6k
Responsive search bar
with loading animation on submit button

Ron Hicks

3 years ago

12.7k
Call to example
Call to example using radial-gradient

Oliver Hansen

3 years ago

9.6k
CTA Search Section
CTA search form

EliteAI Tools

1 year ago

1.7k
Modern Dark Footer with Overlapping Gradient CTA
A comprehensive, dark-themed website footer component built with HTML and Tailwind CSS. It features a visually distinct overlapping section with a colorful gradient background containing a prominent call-to-action (CTA) block. The main footer area utilizes a multi-column grid layout for organized navigation links, a newsletter signup form, and social media icons. A final bottom bar includes legal links and copyright information. The design is responsive and adapts its layout for different screen sizes.

Hamza Atig

1 year ago

1.3k
Survey CTA

JaxStone

3 years ago

14.8k
Tilted button on hover.
A simple button with a gradient and tilt on hover. Dark mode supported with same color.

András Szehofner

1 year ago

1.9k
Footer
A footer is a critical part of any professional website. A footer ensures your website is complete, professional, user-friendly, and legally compliant. It's where users go for answers when they're done scrolling.

KULDEEP

1 year ago

1.5k
No distraction search field

_Amar_

3 years ago

12.5k