This simple guide will show you how to change the color of the navigation bar to whatever you want.

Step 1

Copy this code:

<style>
  .nav-02,
  .nav-02 .nav-02__list_wrapper {
    background-color: #000;
  }  
</style>

Step 2

Paste it into your General settings > </body> custom HTML code

Step 3

Replace the color code with your own one:

Done!

Now your navigation bar has the color you specified.

Make buttons white

In addition, you can make all links and buttons on the navigation bar white . To do this kindly copy this code:

<script>
document.querySelectorAll(".nav-02 .nav-02__item > .button--black-outline, .nav-02 .buttons-set .button--black-outline, .nav-02__logo_text").forEach(item=>{
  item.classList.remove("button--black-outline");
    item.classList.add("button--white-outline");
}) 
</script>

And paste it nto your Website settings > Custom code > </body> custom HTML code

Updated on: 18/12/2023