Navbar with Background Colors & Styling

• .navbar-light → Light theme
• .navbar-dark → Dark theme
• .bg-primary / .bg-dark → Background colors

Example: Dark Navbar

<nav class="navbar navbar-dark bg-dark">
  <div class="container">
    <a class="navbar-brand" href="#">Brand</a>
  </div>
</nav>

Output:

Example: Colored Navbar

<nav class="navbar navbar-light bg-primary">
  <div class="container">
    <a class="navbar-brand text-white" href="#">Brand</a>
  </div>
</nav>

Output:

Explanation:

• .navbar-dark with .bg-dark creates a dark theme.
• .navbar-light with .bg-primary creates a colored navbar.