Change TAB text color or background color

Is there a way to change the color of the title of the tab or the background color of the tab itself(not the whole page background).

Hello @dpeete,

You can change the background color of the tab with the following CSS. Just change the color in the code to the one you prefer.

/* chnage tabs background color */
.fd-form .nav-tabs .nav-link { 
  background-color: red;
}
/* change active tab background color */
.fd-form .nav-tabs .active.nav-link { 
  background-color: yellow;
} 

Please use it in CSS Editor.
image

1 Like

Hi @mnikitina
The code above just changes the tab title background, is there a way to change the background colour of the whole tab? And/or put a border around the tab?

Hello @Nick.Jones,

Do you mean the background of the tab content? Try out this CSS:

.tab-pane.show.fade.active {background-color: lightgrey;}
1 Like

Thanks @mnikitina , that's exactly what I wanted :smile:

1 Like