Documentation for Confluence 5.8 (Server).
Documentation for Confluence Cloud 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 from the bottom of 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 from the header

    Note: The Space Admin option appears only if you have space admin permissions, or if you're part 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
  • 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 

Handy Hint

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


  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 for further investigation.

      Hope that helps.


  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,

      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.


        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?



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



  7. Anonymous


    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?



  10. I don't have an Edit button for the 'Theme' colour scheme (for the Documentation theme), only the Custom one. I have Administrator access. Do I need some sort of 'special power' to be able to edit the Theme colour scheme? Or is this not actually possible?

    1. Hi Emma,

      If you choose Select next to the Custom Colour Scheme, you'll then get an edit option so you can change the colours of your space.

      1. The Custom colour scheme is fine, it's the Theme colour scheme I want to edit...

        1. Hi Emma,

          The Custom Colour Scheme is the only one you can edit at the space level. The Theme Colour Scheme's colours are set and can't be changed.

          If you want to make changes that will be the default across your site, you can edit the Global Colour Scheme by going to General ConfigurationColour Scheme, then editing the colour scheme for your site.

          If you edit the global colours, you can still set different colours for individual spaces.

  11. Hi all,

    Although the color scheme offers to edit a lot of UI elements, I do not find how to edit these elements:



    (This is their HTML id)

    It is the border of every page. It would be better if I attach a screenshot but I'm not allowed to upload files...

    Thanks in advance,



    1. Hi Nicolas,

      You should be able to change the appearance of those elements using CSS in either the global or space stylesheet. If you're comfortable with CSS, take a look at Styling Confluence with CSS for instructions on accessing the stylesheet.

      1. Hi Giles,

        Thanks a lot.

        You're right, so I've added this rule:

        #original_design_top, #original_design_content { 
        background-color: #ff9900 !important;
        border-color: #ff9900 !important;

        Note the mandatory '!important' mention (to override native css file) otherwise it does not make any change.

  12. I've set a custom color scheme under in which I've set the top bar to be a white background with dark text. Sadly, underneath the header bar is a very dark blue one pixel line across the width of the screen. Any one know how to set the color of this line?

    In Jira, I think this is called "Header Separator Color" but I can't find it in Confluence... As a follow up, why are Jira, Confluence and Stash completely inconsistent in their look and feel customisation!? Surely it's not uncommon for an organisation to use more than one Atlassian tool!

    1. Hi James,

      You're right that you can't select the colour for that line in the Colour Scheme settings. You can, however, change it in the space stylesheet if you like.

      Add this to the space's stylesheet, and change the line that any colour you like.

      .aui-header {

      border-bottom: 1px solid #cccccc /*Set your desired hex or RGB colour*/
      1. Thanks, this works well for the spaces, its a shame it isn't global to all pages, but no problem for me.