Visual typography

Typography is very important to Solaris; it plays a key part in telling our story. We use two typefaces to meet our needs, with a third only for publications. We believe that delivering focused content starts with evocative language, and we want our typography to deliver that.

Typefaces

Solaris uses three typefaces in its designs. These typefaces are our Productive, Expressive and Publication typefaces that are used for different reasons.

Filson Soft

Filson Soft is our emotive and brand type face. It is used for headings. Filson Soft carries the design language into the visuals. We use Filson Soft whenever we want to put a stronger focus on the words and their design, rather than information. This is our secondary font.

Lato

Lato is our productive and primary font. This face is used wherever we need to display content on the products and marketing material that has a focus on reading. Its robust weights lets us be flexible in its use across the board.

Merriweather

The alternative typeface we use is Merriweather. Merriweather is a serif font that has a focus on readability. We only use this typeface is official print publications where there is a large about of content on each page. This font can be found in our Bots that Code book, which has an academic voice and only uses our illustrations in limited scale. It is a replacement for Lato.

Scale

Our type scale is based on a golden ratio of (1:618) with adjustments to fit better for interfaces. This scale allows us to use large expressive headings and legible small type.

Style

Our typography is broken down into two different versions. Emotive and productive. The emotive sizes include the headings and the primary body text. These are used for almost all our designs across the brand. Productive styles are used mainly for the products to allow for clear messaging even at a small size.

Weights

There are also three weights we use and are defined in style of type.

Colour

Colour is important to create a sense of excitement in Solaris. However, we adhere to strict usability standards and thus all content should be limited to primary (void) or secondary (light). Only active links can break this with the use of brand 1 (sol). The colours should be used where the highest contrast is achieved. For lower hierarchy content, a transparency may be applied. This is normally capped at 0.6. There is a guide in the colours’ page on what foreground and background combinations are allowed.

Hierarchy

The typography hierarchy follows a simple three levels. These levels help give the reader a guide on what is most important and allows them to follow the content with ease.