Styling Fonts in Confluence

On this page

Still need help?

The Atlassian Community is here for you.

Ask the community

Confluence provides the ability to adjust its visual style via Cascading Style Sheets (CSS). This tutorial shows you to change the fonts and font sizes of a Confluence page, using a few lines of CSS.

Below is the code for the custom font. Copy and paste it into the Space Stylesheet form within the Space Administration section.

Changing the fonts

In order to customize the fonts in Confluence, you first need to set the body font to the font you want. Secondly, you may want to adjust the font size because different fonts have different relative sizes.

The relevant CSS is shown below. It changes Confluence's font from the default of Helvetica/Arial – sans serif  to Times/Times New Roman – serif. To adjust for the fact that Times is a bit smaller than Helvetica, we increase the font size to 14 pixels. The many styles that 'wiki-content' in their definition are necessary to change the font size for all the tags in the wiki content.

To edit a space's stylesheet:

  1. Go to the space and choose Space tools > Look and Feel from the bottom of the sidebar
  2. Choose Stylesheet then Edit.
  3. Paste your custom CSS into the text field.
  4. Save your changes. The new CSS will be visible on all content pages in the space.
.wiki-content,
.wiki-content p,
.wiki-content table,
.wiki-content tr,
.wiki-content td,
.wiki-content th,
.wiki-content ol,
.wiki-content ul,
.wiki-content li {
 font-family: Times, "Times New Roman", serif;
 font-size: 14px;
}

Notes

Note: By default, only system administrators can edit the CSS for a space or for the site. To allow any user with Space Admin permissions to edit the CSS for a space, go to Administration  > General Configuration > Security Configuration and select Custom Stylesheets for Spaces.

Last modified on Jul 30, 2024

Was this helpful?

Yes
No
Provide feedback about this article
Powered by Confluence and Scroll Viewport.