Home
ariaw
Call to Action (CTA) Section

Call to Action (CTA) Section

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

Call to Action

Author ariaw

571

Fork Fullscreen

<section class="bg-gradient-to-r from-blue-600 to-blue-800 text-white py-16 px-4">
  <div class="container mx-auto max-w-4xl text-center">
    <h2 class="text-3xl md:text-4xl font-bold mb-6">Ready to transform your business?</h2>
    <p class="text-xl md:text-2xl text-blue-100 mb-10 max-w-3xl mx-auto">
      Join thousands of satisfied customers who trust our solutions every day.
    </p>
    
    <div class="flex flex-col sm:flex-row justify-center gap-4">
      <a href="#" class="bg-white text-blue-700 hover:bg-blue-50 px-8 py-4 rounded-lg font-semibold text-lg transition duration-300 transform hover:scale-105 shadow-lg">
        Get Started Now
      </a>
      <a href="#" class="border-2 border-white text-white hover:bg-white hover:text-blue-700 px-8 py-4 rounded-lg font-semibold text-lg transition duration-300 transform hover:scale-105">
        Schedule a Demo
      </a>
    </div>
    
<div class="mt-12 flex flex-col sm:flex-row items-center justify-center sm:space-x-4 space-y-4 sm:space-y-0">
  <div class="flex -space-x-2">
    <img class="h-10 w-10 rounded-full border-2 border-white" src="https://randomuser.me/api/portraits/women/12.jpg" alt="Customer">
    <img class="h-10 w-10 rounded-full border-2 border-white" src="https://randomuser.me/api/portraits/men/43.jpg" alt="Customer">
    <img class="h-10 w-10 rounded-full border-2 border-white" src="https://randomuser.me/api/portraits/women/34.jpg" alt="Customer">
  </div>
  <div class="text-center sm:text-left">
    <p class="text-sm text-blue-200">Trusted by 10,000+ businesses</p>
    <div class="flex items-center justify-center sm:justify-start">
      <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
        <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z" />
      </svg>
      <span class="ml-2 text-white font-medium">4.9/5 from 500+ reviews</span>
    </div>
  </div>
</div>
  </div>
</section>

Related Examples

Get Started ,Membership section - responsive - darkMode

Author:
ABDO-SY

8 months ago

820
Call to Action section
CTA with clear message and big button

Author:
magersa

1 year ago

4.5k
Free Responsive Hero Section
Get this professional hero section for your website. Includes a gradient text effect, stylish background blurs, and a perfectly aligned image section. Easy to integrate and fully customizable for any project.

Author:
Homayoun

2 months ago

87
Hero section with image

Author:
Sophia Baker

2 years ago

12.9k
Clean CTA section

Author:
Pixel Perfect

1 year ago

3.7k
CTA section with light beam from bottom effect
It also has support for dark mode

Author:
Pixel Perfect

1 year ago

1.9k
Fancy call to action

Author:
Leon Bachmann

2 years ago

10.5k
Animated Gradient Button Component
Button component with smooth hover effects and glass-morphism design. Features expanding gradient animation, rotating icon, and responsive layout. Perfect for call-to-action buttons, landing pages, and web applications. Easy copy-paste Tailwind CSS code ready for integration.

Author:
Homayoun

2 months ago

276
Call to Action

Author:
Abdul Baset Bappy

5 months ago

576
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

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

Author:
Diego Chavez

2 years ago

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

Author:
Bonimater

5 months ago

355

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components