Home
Samuel Dawson
CTA block

CTA block

This tailwind example is contributed by Samuel Dawson, on 16-Dec-2022. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are CTA,banner

Call to Action

Author Samuel Dawson

11.7k

Fork Fullscreen

<section class="h-auto bg-black w-full pt-12 md:pb-20 border-b border-[#23232C] p-3">
    <div class="max-w-6xl mx-auto md:text-center tails-relative">
        <h2 class="jakarta text-white font-bold text-xl md:px-0 px-10 md:text-3xl">And many more features ✨</h2>
        <p class="text-gray-400 mt-2 md:mt-5 md:px-0 px-10 md:text-2xl">Try out the app for yourself to see them all!
        </p>
        <a href="#"
            class="inline-flex mt-12 justify-center md:mt-8 items-center w-full px-8 py-5 md:mb-6 text-xl font-bold text-white bg-gradient-to-r from-blue-600 to-indigo-700 hover:from-blue-500 hover:to-indigo-700 sm:mb-0 md:w-auto hover:bg-indigo-600 md:rounded-full">
            <svg class="w-5 h-5 mr-2 fill-current" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                <g fill="none" stroke="none">
                    <path
                        d="M6 12l5.485-5.485A12 12 0 0 1 19.971 3H21v1.029a12 12 0 0 1-3.515 8.486L12 18m-6-6l6 6m-6-6L3 9l.828-.828A4 4 0 0 1 6.657 7H11l-5 5zm6 6l3 3 .828-.828A4 4 0 0 0 17 17.343V13l-5 5zm-4.5-4.5l-2.379 2.379A7.242 7.242 0 0 0 3 21a7.243 7.243 0 0 0 5.121-2.121L10.5 16.5"
                        stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
                    <path d="M16.778 7.916a.5.5 0 1 1-.556-.832.5.5 0 0 1 .556.832z" fill="#212121"
                        stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
                </g>
            </svg>
            <span>Try the App for FREE</span>
        </a>
    </div>
</section>

Related Examples

Hero section with call to action buttons

Author:
Prashant

3 years ago

15.1k
an off line game of catching afox
an off line game of catching afox

Author:
Bonimater

5 months ago

255
Promotion Block
It features a large, centered title, a brief description, and a prominent CTA button, all centered within a visually appealing layout.

Author:
Computer guy

2 years ago

7.4k
Hero section with image

Author:
Sophia Baker

2 years ago

12.7k
Call to Action (CTA with Background Image)
A Call to Action (CTA) is an essential element in marketing and web design that prompts users to take a specific desired action. When combined with a compelling background image, it can significantly enhance user engagement and conversion rates.

Author:
Eliyanto Sarage

1 year ago

2.7k
CTA banner
With fading bg gradient

Author:
Lautaro Gómez

1 year ago

1.1k
CTA - Htmlwind
Screenshot on dark background

Author:
Htmlwind

5 months ago

260
Component-[callToAction]

Author:
Matti

10 months ago

857
Travel Landing Page: Australia

Author:
Maxim

7 months ago

1.7k
YouTube subscription section

Author:
Leif99

2 years ago

14.1k
Take a Survey CTA section

Author:
JaxStone

2 years ago

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

Author:
András Szehofner

9 months ago

958

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components