Home
Htmlwind
CTA - Htmlwind

CTA - Htmlwind

Screenshot on dark background

This tailwind example is contributed by Htmlwind, on 02-Jun-2025. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are CTA,banner

Call to Action

Author Htmlwind

841

Fork Fullscreen

<div class="bg-white py-24 sm:py-32">
  <div class="mx-auto max-w-7xl sm:px-6 lg:px-8">
    <div class="relative isolate overflow-clip bg-gray-900 px-6 pt-16 shadow-2xl sm:rounded-3xl sm:px-16 md:pt-24 lg:flex lg:gap-x-20 lg:px-24 lg:pt-0">
      <div aria-hidden="true" class="absolute right-0 top-0 -z-10 aspect-square w-full max-w-3xl translate-x-3/4 rounded-full bg-pink-500/60 blur-[10rem] lg:-top-[40rem] lg:left-1/2 lg:-translate-x-1/2"></div>
      <div class="mx-auto max-w-md text-center lg:mx-0 lg:flex-auto lg:py-24 lg:text-start">
        <h2 class="text-3xl font-semibold tracking-tight text-white sm:text-4xl">Want to partner with design experts in SaaS?</h2>
        <p class="mt-6 text-base text-gray-300">We're excited to talk to you about your project requirements and business goals.</p>
        <div class="mt-10 flex items-center justify-center gap-x-6 lg:justify-start">
          <a href="#" class="rounded-md bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 hover:bg-gray-100 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white">Schedule a call</a>
          <a href="#" class="text-sm font-semibold leading-6 text-white">Send an email</a>
        </div>
      </div>
      <div class="relative mt-16 h-80 lg:mt-8 lg:h-auto">
        <img width="1920" height="1139" class="absolute left-0 top-0 w-[58rem] max-w-none rounded-2xl bg-white/5 ring-1 ring-white/10 lg:top-14" src="https://htmlwind.com/assets/images/dark-dashboard-screenshot.webp" alt="dashboard screenshot" />
      </div>
    </div>
  </div>
</div>

Related Examples

CTA Search Section
CTA search form

Author:
EliteAI Tools

1 year ago

1.2k
Sign In Form
Clean and modern Sign In form with email, password, and "Forgot password" link. Fully responsive and styled with Tailwind CSS, perfect for SaaS platforms.

Author:
Lekhraj Ghimire

7 months ago

694
SaaS Feature Section
It has a Gradient text headline and CTA buttons

Author:
Junclarkaizen Pagu

2 years ago

9.4k
Login page
Login and register page, you can reuse both

Author:
Abhiraj

1 year ago

1.8k
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
Tilted button on hover.
A simple button with a gradient and tilt on hover. Dark mode supported with same color.

Author:
András Szehofner

1 year ago

1.1k
Product Page
Showcase for the product.

Author:
muhamadrofii911

1 year ago

2.5k
Navbar with two CTA buttons

Author:
Juraj

11 months ago

1.6k
Contact us Form with Responsive

Author:
KULDEEP

7 months ago

622
REGISTER - CTA - SECTION animation

Author:
ABDO-SY

9 months ago

680
Newsletter Signup Form
It features a clean and modern design with a background illustration, making it visually appealing.

Author:
TailwindFlex

2 years ago

8k
Centered footer with CTA
Use this Tailwind CSS footer compoent for simple footer with center aligned everything and with CTA buttons.

Author:
Pagedone

1 year ago

2.1k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components