Bootstrap 5 Navbar Forms

Bootstrap 5 Navbar Forms are used to create the components like a search bar, or login within a navbar.

Bootstrap 5 Navbar Forms Classes: No special classes are used in Navbar Forms. You can customize the form using Navbar and Form classes

Syntax:

<nav class="navbar">
 <form>
 <input class="form-control" type="..." >
 <button class="btn" type="...">...</button>
 </form>
</nav>

Below example illustrate the Bootstrap 5 Navbar Forms:

Example 1: In this example, we will create a search bar in Navbar Forms:

Output:

👁 Image

Example 2: In this example, we will use the Navbar form with other nav elements.

Output:

👁 Image

Reference: https://getbootstrap.com/docs/5.0/components/navbar/#forms