How Do I Change the Colour of the Crowd Header
Platform Notice: Data Center Only - This article only applies to Atlassian products on the Data Center platform.
Note that this KB was created for the Data Center version of the product. Data Center KBs for non-Data-Center-specific features may also work for Server versions of the product, however they have not been tested. Support for Server* products ended on February 15th 2024. If you are running a Server product, you can visit the Atlassian Server end of support announcement to review your migration options.
*Except Fisheye and Crucible
Summary
Atlassian Support Offerings
The following approaches are considered Confluence customizations that are beyond the scope of Atlassian Support Offerings. Atlassian will not be held liable for any errors or other unexpected events resulting from the use of the customizations.
Solution
Symptoms
You may want to alter the colour of the Crowd header. This is often done to make it easier to differentiate between production and development environments of applications.
Resolution
Changes to the main.css file will not require a restart. Changes will be reflected upon reloading any Crowd page in the browser.
Open the
<crowd-installation-directory>/crowd-webapp/console/style/main.cssfile with a text editorAdd the
.aui-headersection. For example, make the following change to make the header:1 2 3 4 5 6 7.aui-header { min-height: 42px; background-color: #C33; background-repeat: repeat-x; color: #99B3CC; }Save the file.
ℹ️ You may need to clear your browser cache if refreshing the page does not help. Alternatively, you may try Clearing the Crowd Plugin Caches.
All the documentation for the Atlassian User Interface is available online.
Was this helpful?