Home
Juraj
Navbar with two CTA buttons

Navbar with two CTA buttons

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

Call to Action Navbar

Author Juraj

1.2k

Fork Fullscreen

<div class="hidden md:flex space-x-6">
        <a class="hover:text-bluegreen hover:underline" href="/">Home</a>
        <a class="hover:text-bluegreen hover:underline" href="/services">Services</a>
        <a class="hover:text-bluegreen hover:underline" href="/project">Project</a>
        <a class="hover:text-bluegreen hover:underline" href="/about-us">About us</a>
      </div>

<div class="hidden md:flex space-x-4">
        <a class="rounded-xl p-3 bg-bluegreen hover:bg-white hover:text-bluegreen" href="/started">Get Started</a>
        <a class="rounded-xl p-3 border-2 border-white hover:bg-white hover:text-black" href="/talk">Let's talk</a>
      </div>

<div x-cloak x-show="open" x-transition class="absolute top-full left-0 w-full bg-gray-800 lg:hidden flex flex-col items-center py-5 space-y-4 ">
        <a class="hover:text-bluegreen hover:underline" href="/">Home</a>
        <a class="hover:text-bluegreen hover:underline" href="/services">Services</a>
        <a class="hover:text-bluegreen hover:underline" href="/project">Project</a>
        <a class="hover:text-bluegreen hover:underline" href="/about-us">About us</a>
        <a class="rounded-xl p-3 bg-bluegreen hover:bg-white hover:text-bluegreen" href="/started">Get Started</a>
        <a class="rounded-xl p-3 border-2 border-white hover:bg-white hover:text-black" href="/talk">Let's talk</a>
      </div>
    </nav>

Related Examples

Footer
A footer is a critical part of any professional website. A footer ensures your website is complete, professional, user-friendly, and legally compliant. It's where users go for answers when they're done scrolling.

Author:
KULDEEP

3 months ago

674
admin panel UI
Premium Admin Panel Pack including sidebar navigation, top navbar, dashboard cards, user tables, quick actions, profile section, and footer. Fully responsive with modern clean design using Tailwind CSS.

Author:
Lekhraj Ghimire

3 months ago

1.2k
Best Responsive Navbar Design | Easy & Modern Navigation
Learn how to create a fully responsive navbar using HTML, CSS, and JavaScript. Perfect for beginners and developers looking for a modern, mobile-friendly navigation bar.

Author:
Vishvajeet

8 months ago

3.4k
Responsive navbar
navbar with the dropdown on mobile devices

Author:
Piet Vriend

2 years ago

36.8k
E-Commerce Delivery Truck Animation
This responsive CSS animation showcases a delivery bus transporting a package to its destination, created entirely with Tailwind CSS and pure HTML. The animation features

Author:
Bonimater

4 months ago

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

Author:
magersa

1 year ago

4.4k
Clean CTA

Author:
Kofi Osei

2 years ago

11.4k
Call for action

Author:
Sophia Baker

2 years ago

11.1k
Collapsible Sidebar Menu

Author:
Rajesh Maheshwari

7 months ago

1.9k
Domain For Sale Template
Domain For Sale Template

Author:
Geoffrey Callaghan

1 year ago

3.9k
Portfolio Hero Section 5

$$@(\/)(\/)¥$ Author:
$@(\/)(\/)¥

6 months ago

1.5k
Call to Action
CTA with Dark and Shadow colors

Author:
KULDEEP

3 months ago

367

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components