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.3k

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

macOS Style Webpage – macOS Design in the Browser
A simple webpage inspired by the macOS interface. It recreates the clean design, dock, and desktop look of macOS using only HTML, tailwind CSS, and JavaScript. This project focuses on front-end styling and layout to bring the visual feel of macOS to the web — not a full simulation, just the look and vibe.

Author:
Hamza Atig

1 week ago

171
Banner for app download
Show App Download Buttons for the App Store and Play Store

Author:
Pixel Perfect

1 year ago

1.5k
Call to action

Author:
Leon Bachmann

2 years ago

8.5k
Boost Your Business with a Stunning Website!
Take your online presence to the next level with a high-performing, visually captivating website. Let’s build something amazing together!

Author:
Vikas Kushwah

7 months ago

547
Jumbotron card

Author:
Sienna

2 years ago

11.6k
Responsive NavBar Using CSS Only
A complete responsive navbar only using tailwind css

Author:
Shivam Vishwakarma

4 months ago

213
asimple game lay out
asimple game lay out

Author:
Bonimater

1 month ago

528
Landing page

Author:
Maxim

7 months ago

1.6k
Hero Section
Responsive Hero Section for you Project Background Image: A stunning, high-quality Unsplash photo that creates a unique visual impact. Overlay: Semi-transparent black overlay with blur effect for readability and a modern aesthetic. Content Area: Centered with a gradient background overlay for contrast, bold headline, engaging subtext. Buttons: Vibrant gradient and clean border with smooth hover animations to draw attention. Responsive Design: Looks great on all screen sizes with adaptable padding and font sizes.

Author:
KULDEEP

4 months ago

1.1k
Clean CTA section

Author:
Pixel Perfect

1 year ago

3.6k
Responsive About Section with Tailwind CSS
Built a sleek and fully responsive About Section for my portfolio using Tailwind CSS! 🚀 Designed for smooth adaptability across all screen sizes with a modern and minimal aesthetic. Perfect for showcasing skills, experience, and a personal touch!

Author:
Abdul Baset Bappy

7 months ago

1.2k
ArtoGallery
Explore a curated selection of contemporary and classic artwork, connecting collectors and creators in an inspiring online space.

Author:
ORGIN_DREAMS

5 months ago

857

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components