To make the header semi-transparent (translucent) simply set/remove the following classes on the following elements:
body: add the classes
2 You may need to add a top margin to the elements in the
#highlightedregion so they don't show under the header.
- 3 Also ensure the background image underneath is light in colour so the navbar links can be seen, use the overlay utilities to help here.
- 4 That's it!
The default is to go to a white background when the header is sticky but you can combine
See the demos here: header translucent dark and header translucent primary.