Home
Pixel Perfect
Clean CTA section

Clean CTA section

This tailwind example is contributed by Pixel Perfect, on 07-Feb-2024. Component is made with Tailwind CSS v3. It is responsive. It supports dark mode. similar terms for this example are CTA,banner

Call to Action

Author Pixel Perfect

3.8k

Fork Fullscreen

<div class="bg-slate-50 dark:bg-gray-800 border-b">
    <div class="py-8 px-6 sm:px-6 sm:py-20">
        <div class="mx-auto max-w-2xl text-center">
            <h2 class="text-center text-2xl font-semibold tracking-tight text-black dark:text-white sm:text-4xl">
                Transform your business
                with AI solutions
            </h2>
            <p class="mx-auto mt-3 sm:mt-6 max-w-xl text-md sm:text-lg sm:leading-snug text-gray-600 dark:text-gray-300">
                Experience the
                power of artificial intelligence to streamline your operations and drive growth with AI Pro Solutions!
            </p>
            <div class="mt-6 sm:mt-10 flex items-center justify-center gap-x-6">
                <a class="flex flex-row items-center justify-center min-w-[130px] px-4 rounded-full font-medium tracking-wide border disabled:cursor-not-allowed disabled:opacity-50 transition ease-in-out duration-150 text-base bg-black text-white font-medium tracking-wide border-transparent py-1.5 h-[38px] text-sm py-6 px-8"
                    href="">
                    Discover AI Solutions
                </a>
            </div>
        </div>
    </div>
</div>

Related Examples

Call to action card with image
Responsive card with image

Author:
Noah Schmidt

2 years ago

16.3k
Blog post card
Responsive blog post or article card. This card can also be used as a CTA

Author:
Anonymous

2 years ago

10.6k
Buy Me a Coffee CTA section

Author:
Sienna

2 years ago

10k
Animated Text Rotator | Smooth Tailwindcss Text Transition Effects
Beautiful animated text rotation component with smooth fade transitions. Perfect for hero sections, showcasing features, and engaging website visitors with dynamic content.

Author:
Homayoun

2 months ago

197
Join Our Community Banner
Encourage users to become members of a community.

Author:
Diego Chavez

2 years ago

8.6k
Clean CTA

Author:
Kofi Osei

2 years ago

11.6k
YouTube subscription section

Author:
Leif99

3 years ago

14.3k
Tailwind CSS Button (Wavy Button)
The button uses Tailwind classes for size, background, border, border-radius, shadow, cursor, overflow, and transitions. The wave overlay is absolutely positioned at the bottom of the button, initially off-screen (top-full) and moves to the middle (top-1/2) on hover via the custom .wave class and keyframes. The font-poppins class isn’t a default Tailwind class. You should define it in your Tailwind configuration or replace it with font-sans if you haven't extended fonts.

Author:
KULDEEP

7 months ago

943
Call to action

Author:
Sophia Baker

3 years ago

10.8k
Very simple hero

Author:
Laurits

3 years ago

9k
SliceHeaven
delivering pizza

Author:
INGRIDE MUZIRANENGE

8 months ago

730
Call to Action section for home page

Author:
Sophia Baker

3 years ago

9.5k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components