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

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

Hero section with call to action buttons

Author:
Prashant

2 years ago

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

Author:
Anonymous

1 year ago

9.6k
Brutalist Hero

Author:
threehymns

6 months ago

1.6k
Call to Action section
CTA with clear message and big button

Author:
magersa

1 year ago

3.8k
Clean CTA

Author:
Kofi Osei

2 years ago

11.3k
Tailwind CTA section

Author:
Moriba Traore

2 years ago

12.6k
Call to action
CTA

Author:
inbarajan P

9 months ago

1.2k
Call to Action section
CTA with clear message and big button

Author:
Curtis Bickler

8 months ago

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

Author:
Abhiraj

4 months ago

1.1k
Acode master
Welcome to Hamza's official portfolio — a creative developer blending modern design with powerful code. Explore animations, projects, and innovations crafted with HTML, Tailwind CSS, and passion.

Author:
Acode Master(Mfuranziza Dusabe Hamza)

3 weeks ago

115
CTA block
with user avatars and 2 buttons

Author:
Carla Hoffman

1 year ago

1.9k
Hero section

Author:
Mohit Prajapati

2 years ago

11.7k

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components