It's not the same without you

Join the community to find out what other Atlassian users are discussing, debating and creating.

Atlassian Community Hero Image Collage

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

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.

1 comment

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.

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;
}

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.

Comment

Log in or Sign up to comment
Community showcase
Published in Confluence

Introducing Confluence Cloud and Jira Software Cloud Premium

Wherever you are in your team’s journey , our goal is to support your big ambitions. We’re a cloud-first company with the mission of unleashing the potential of every team, and to address the range ...

616 views 4 17
Read article

Community Events

Connect with like-minded Atlassian users at free events near you!

Find an event

Connect with like-minded Atlassian users at free events near you!

Unfortunately there are no Community Events near you at the moment.

Host an event

You're one step closer to meeting fellow Atlassian users at your local event. Learn more about Community Events

Events near you