Transparent Navbar text color

Dear @dojo44

You could use the mix-blend-mode property, which specifies how an element's content should blend with its direct parent background.

Try to add to your .scss :

.nav-link,
.md-form,
.navbar-brand {
  mix-blend-mode: difference;
}

and the navbar:

<!--Navbar-->
<mdb-navbar SideClass="navbar navbar-expand-lg navbar-dark white">
  <!-- Navbar brand -->
  <mdb-navbar-brand><a class="navbar-brand" href="#">Navbar</a></mdb-navbar-brand>

  <!-- Collapsible content -->
  <links>
    <!-- Links -->
    <ul class="navbar-nav mr-auto">
      <li class="nav-item active">
        <a class="nav-link waves-light" mdbWavesEffect
          >Home<span class="sr-only">(current)</span></a
        >
      </li>
      <li class="nav-item">
        <a class="nav-link waves-light" mdbWavesEffect>Features</a>
      </li>
      <li class="nav-item">
        <a class="nav-link waves-light" mdbWavesEffect>Pricing</a>
      </li>

      <!-- Dropdown -->
      <li class="nav-item dropdown" dropdown>
        <a
          dropdownToggle
          mdbWavesEffect
          type="button"
          class="nav-link dropdown-toggle waves-light"
          mdbWavesEffect
        >
          Basic dropdown<span class="caret"></span
        ></a>
        <div *dropdownMenu class="dropdown-menu dropdown dropdown-primary" role="menu">
          <a class="dropdown-item waves-light" mdbWavesEffect href="#">Action</a>
          <a class="dropdown-item waves-light" mdbWavesEffect href="#">Another action</a>
          <a class="dropdown-item waves-light" mdbWavesEffect href="#">Something else here</a>
          <div class="divider dropdown-divider"></div>
          <a class="dropdown-item waves-light" mdbWavesEffect href="#">Separated link</a>
        </div>
      </li>
    </ul>
    <!-- Links -->

    <!-- Search form -->
    <form class="form-inline waves-light" mdbWavesEffect>
      <div class="md-form my-0">
        <input class="form-control mr-sm-2" type="text" placeholder="Search" />
      </div>
    </form>
  </links>
  <!-- Collapsible content -->
</mdb-navbar>
<!--/.Navbar-->

From now, when you change navbar background color (for ex. to black), text color should change to white.

Hope it helps!

Best Regards, Bartosz.