Ship Atlassian with a more readable default font (and not Arial)

[Christian Helmbold]

I don't know where to make this suggestion, so I try it here ... I want to suggest that Atlassian ship Confluence with a more readable font than Arial. I've just spend several days reading the customer's confluence and got tired of reading Arial. I suggest to make Source Sans Pro the new default font. It is not only more readable on different kinds of monitors but looks better, too. Open Sans is another good font.

For other users suffering from Arial: there is a nice Plug-in for Firefox and Chrome called "Stylish" that makes overrding CSS per site easy.

[Thomas Kreft]

You can use a custom stylesheet to accomplish this within Confluence, either within a space (recommended for testing purposes) or globally.

As a space administrator, e.g. in your personal space, go to Space tools -> Look and Feel, Stylesheet, and Edit the Space Stylesheet as follows:

// use !important to override batch.css

body {
  font-family: Calibri, Arial, sans-serif !important;
  font-size: 14px !important;
}
.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: Calibri, Arial, sans-serif !important;
  font-size: 14px !important;
}

Change the font family and font size to your liking.

Once you're satisfied, you can apply this globally (in General configuration -> style sheet).

Works great for us, but I agree there should be a better, standard way to configure the used fonts.

[Mary Connor]

Yay! it's easy to add a Google font here:

@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed');
body {
font-family: Roboto Condensed, Arial, sans-serif !important;
font-size: 16px !important;
}
.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: Roboto Condensed, Arial, sans-serif !important;
font-size: 16px !important;
}

[Steffen Heller]

Are you sure that your method of using a custom font really works?
Simply defining it with "font-family" in the "body"?
When using both your codes in the PDF Export Stylesheet I still have the same standard font when exporting to PDF.

To my knowledge and experience, before using a custom font you have to include it with @font-face { ... } first.

This is what I have done numerous times and it works.
Unfortunately, with that I run into follow up problems: certain special chars are omitted in the PDF (see https://community.atlassian.com/t5/Confluence-questions/Display-special-symbols-in-PDF-when-using-another-font/qaq-p/816483)

Being able to use a custom font WITHOUT @font-family would probably solve my problem. So I am curious about that.