Change the navbar color in MaterializeCSS

Question

I want to dynamically change the background color of the navbar from Materialize, so it needs to be done via a CSS. I tried doing

.nav-wrapper{
 background-color: <MYCOLOR HERE> !important;
}

But it just stays the same colored as mentioned in the class of the navbar.

Answer 1

Because in Materialize you have to change nav's background-color, for example you want white navbar:

.nav {
  background-color: #ffffff !important;
}

Another solution, to add <nav>'s class white:

<nav class="white">

It'll change navbar's backgroud-color too.

If you're using sass or scss, you have one more solution:

nav {
  @extend .white;
}

Hope, it helps you!