Navbar

For navigation at the top of the page.

  • <Navbar> The navigation bar component.
  • <Navbar.Brand> Set a brand, which can be your company, product or project name.

Usage

import { Navbar, Nav } from 'rsuite';

// or
import Navbar from 'rsuite/Navbar';
import Nav from 'rsuite/Nav';

Examples

Basic

Appearance

appearance values include: default,inverse,subtle.

In high-contrast theme, all appearances looks the same as default.

Props

<Navbar>

Property Type (Default) Description
as ElementType ('div') You can use a custom element type for this component
appearance 'default' | 'inverse' | 'subtle'('default') The appearance of the navigation bar
classPrefix string ('navbar') The prefix of the component CSS class
Vercel banner