Documentation for Confluence 5.4.
Documentation for Confluence OnDemand and earlier versions of Confluence is available too.

Skip to end of metadata
Go to start of metadata

Confluence allows you to customise the colour scheme of a space. By default, a space's colour scheme is based on global settings configured from the Administration Console.

You need to be a space administrator to edit a space's colour scheme.

To change the colour scheme for a space:

  1. Go to the space and choose Space tools > Look and Feel on the sidebar.
  2. Choose Colour Scheme
  3. Choose Select next to a scheme listed under Custom Colour Scheme (if not already selected).
  4. Choose Edit.
  5. Enter standard HTML/CSS2 colour codes, or use the colour-picker to choose a new colour from the palette provided. Any changes you make will immediately be reflected in this space.

If your space uses the Documentation theme:

  1. Choose Browse > Space Admin at the top of the screen.
    Note: The 'Space Admin' option appears only if you are a space administrator for the space or you are a super user (a member of the confluence-administrators group).
  2. Choose Colour Scheme under the heading Look and Feel.
  3. Follow the steps above to select a custom colour scheme and edit the colours. 

The colour scheme allows you to edit the colours of UI elements including the top bar, tabs and backgrounds. 

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
  • 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 


Handy Hint

Icon

If you mess things up, just choose Reset then try again.

15 Comments

  1. Anonymous

    I am unable to change the space colours, even though I am the space administrator.  I have created the color palette, but nothing is changed or displayed.

    1. Hi,
      Can I know how did you configure the Colour Scheme?
      As far as I am concern, your Custom Colours Scheme will not display, if its using the Global Colour Scheme.
      Browse to your Space Admin and make sure that your Custom Colour Scheme is selected. Another alternative is by changing the Colour Scheme in Administrator Console. But bare in mind that this changes will be applied to all your spaces in Confluence. Refer to attached link for more information on how to change Colour Scheme in Administrator Console.

      If the above doesn't work please raise support ticket in https://support.atlassian.com for further investigation.

      Hope that helps.

      Cheers,
      Komathi

  2. Anonymous

    I wonder if it is possible to change the heading formatting (h1, h2 etc). The standard formatting looks a bit cluttered on a page so I would like to emphasize each header type a bit differently. (eg background coloring or font change etc). Also I wonder if it is possible to get an automatic numbering that increments individually for each header type?

    Btw, we are running a hosted version of Confluence. So I guess manually changing the css files on the server is not an option for us.

    1. Hi,

      You might want to change the style by using the HTML macro or in the space stylesheet via Space Admin >> Stylesheet. I have create an example code on changing the background colour below, please give it a try:

      To change the style via Space Admin >> Stylesheet, you will need to paste the code shown below:

      Alternatively, using the html macro to change the header, you can paste the following code in a page:

      Hope that helps.
      Best rgds,
      Zed

      1. Anonymous

        I added that code to my global stylesheet, but it did not change any of my h1's?

        All my h1, h2... have a gray background that I want to remove.

        I am on 3.0.2.

        Thanks

        1. I have the same problem. I want to change the font-color of the headers (h1, h2, h3...), but nothing seems to work. I've tried within the option colour scheme to change the color of heading text and of space name text: no result. Then I've tried to add a Space stylesheet with some styling:

          h1, h2, h3, h4, h5, h6 {  
          color: #DF6E08;  
          }

          again no result... :-(

          Any suggestion?

          Thanks,

          Patrizia

          1. Anonymous

            Yup, same here. I am a space admin on Confluence 3.4.7. I tried changing the header color using the color picker first, then I tried using the stylesheet in the manner described above. Doesn't work...

  3. Anyone happen to have a nice screen cap calling out these different elements in an example?

  4. The Documentation Theme would be nice to colorize, namely the navigation bar on the left.

    Though there is no such color resource available. Would be nice to consider in a future release.

  5. Can we customize the Note, Tip and Warning icons? 

  6. Anonymous

     

    Does anyone know how to set a box in a particular colour? I can change the colour of the text.. But can fill that box with a colour..

    Thanks

    Daren

  7. Anonymous

    Hi!

    The Space Name Text and Heading Text colour changes do not seem to apply to anything. Nothing changes. I have tried to find the changing text but I cannot. Is there a bug or is it just hard to find the effect? 

    1. Anonymous

      Restricted in OnDemand?

  8. Anonymous

    Handy hint, make it easier to understand or introduce a Preview option. Some of us are trying to get colours right urgently on a live site after upgrading and having the upgrade lose our custom colour scheme.  Here's another crazy idea, let's have more than 3 colour scheme's to play with Global, Theme and 1 custom is simply not enough.

  9. On my on demand version, in the top right corner, the 'pages' icon doesn't adapt to the color scheme, it stays white when the other icons ('help', 'administartion', 'notifications') adapt to the 'Top Bar Text' setting. This is annoying because my 'Top Bar' is white, therefore the pages icon becomes invisible. Has this already been reported?