Change the SuiteBar Color
Question
I need to change the blue top ribbon color for an Office 365 Team Site. I have read dozens of instructions including those in these forums, but they don't seem to work. Some of the instructions are dated because MS is always changing things. Specifically, I have tried editing the CSS and changing suitebar colors. I have tried adding recommended entries to the CSS file. The closest I have come is to edit the palette001.spcolor
file. This changes the colors correctly when viewing the available themes, but does not take when the theme is applied. I feel like I'm losing my mind - this shouldn't be so difficult.
Thanks!
Solution
Instead of using CSS, customize it from the admin section. Here is an excellent step by step instruction from Microsoft:
Customize the Office 365 theme for your organization
In case CSS is your only option, use the following style:
div.o365cs-base.o365cst.o365spo .o365cs-topnavBGColor-2, div.o365cs-base.o365cst.o365spo.o365cs-topnavBGColor-2, div.o365cs-base .o365cs-topnavLinkBackground-2 {
background-color: Red;
}