Pro Components

Base Components

Navigation 2

Navbar with logo, nav links and dropdown, optional star count, and mobile drawer with accordion menu.

Example

Sign up

Introduction

Navigation 2 provides a clean navbar with:
  • Desktop: Logo, navigation with a dropdown (Features) and direct links (Docs, Blog), optional GitHub-style star count, and a primary CTA (Get started).
  • Mobile: Left-side drawer with accordion (Features expandable), Docs and Blog links, and star count in the footer.
It uses the Navigation Menu, Drawer, and Accordion components.

Usage

import { Navbar9 } from "@/components/ui/navbar-9";

<Navbar9 />
Replace the logo, links (Features, Docs, Blog), star count (e.g. "12.5k"), and CTA with your own content. The star badge can link to your repo or be hidden on smaller screens.

On this page

ExampleIntroductionInstallationUsage