Customising Colour Schemes

Confluence administrators can configure a new colour scheme for the site. The default colour scheme for the site will also become the default for all spaces within it. Space administrators can configure a different colour scheme for spaces. The space colour scheme will override the site-wide colour scheme.

To change the site's colour scheme:

  1. Choose the cog icon , then choose General Configuration under Confluence Administration
  2. Choose Colour Scheme in the left-hand panel.
  3. Choose Edit.
  4. Enter standard HTML/CSS2 colour codes, or use the colour-picker to choose a new colour from the palette provided.
  5. Choose Save. Any changes you make will immediately be reflected across the Confluence site.

Some UI elements below are for specific themes, and colour changes may not take effect for other themes. 

  • Top Bar - the top navigation bar background
  • Top Bar Text - the text on the top navigation bar
  • Header Button Background - buttons on the top navigation bar (e.g. Create button)
  • Header Button Text - the text on buttons on the top navigation bar
  • Top Bar Menu Selected Background - background colour of top navigation bar menu items when selected (e.g. spaces)
  • Top Bar Menu Selected Text - text colour of top navigation bar menu items when selected
  • Top Bar Menu Item Text - text on top navigation bar drop down menus (e.g. help or cog)
  • Menu Item Selected Background - highlight colour on top navigation bar drop down menu items
  • Menu Item Selected Text - text colour on highlighted top navigation bar drop down menu items
  • Search Field Background - the background colour of the search field on the header
  • Search Field Text - the colour of the text in the search field on the header
  • Page Menu Selected Background - the background colour of the drop down page menu when selected
  • Page Menu Item Text - the text of the menu items in the drop down page menu
  • Heading Text - all heading tags throughout the space
  • Space Name Text - the text of the current space name located above the page title
  • Links  - all links throughout the space
  • Borders and Dividers - table borders and dividing lines
  • Tab Navigation Background  - the background colour of the tab navigation 
  • Tab Navigation Text - the text of the tab navigation when highlighted
  • Tab Navigation Background Highlight  - the background colour of the tab navigation when highlighted
  • Tab Navigation Text Highlight - the text of the tab navigation  elements when highlighted

Screenshot: Editing the colour scheme 


When you upload a site logo,  Confluence automatically detects the colours in your logo and customises the colour scheme for you. 

You can change the colour scheme as above, or reset your colour scheme back to the default (and still keep your new site logo).

To reset the colour scheme:

  1. Choose the cog icon , then choose General Configuration under Confluence Administration
  2. Choose Colour Scheme in the left-hand panel.
  3. Choose Edit.
  4. Choose Reset.

Notes

  • If you make a mistake, just choose Reset and then try again.
  • Some UI elements are specific to the default theme and may not take effect for other themes.

Was this helpful?

Thanks for your feedback!

Why was this unhelpful?

Have a question about this article?

See questions about this article

Powered by Confluence and Scroll Viewport