Internet Explorer is not supported by Design Library

The last version of Internet Explorer, version 11, was released on October 17, 2013. This is a very long time ago when taking into account the rapid development of web technologies. These days it is often difficult and time consuming to get modern technologies to work well in this old browser. More and more frameworks are dropping support, and even Microsoft themselves has announced that they will fully drop support for IE in their own services in 2021.

Consequently, we have decided to not include support for IE in the Design Library website.

Luckily, there are modern options in active development. Please use Firefox, Edge or Chrome instead.

Typography

Typography is a big part of our identity. When used correctly it helps to create a consistent and coherent look and feel. Our typeface is almost always present in everything that we do and is therefore, an extremely important ingredient in our brand.

Guidelines

Short description

Typography is used to create clear hierarchy throughout the layout. It is the core structure of well designed interfaces. When type scaling is used appropriately it creates intentional flows, user focus, and progressive emphasis.

SEB Sans Serif

Typeface

SEB uses SEB Sans Serif for both its marketing and product brands. It is a strong but neutral typeface that lends personality to the page without overpowering the content.

Find the font in the visual guidelines: SEB visual guidelines

Font-styles

We have had the same naming on font-styles as the html-tags for our headings for a long time. To provide flexibility in our font styles for the headings we have renamed our font-styles to differentiate between style and semantics.

The h-tag will thus be able to have different appearances. The html-tags say what the title is semantically. Font-style tells how it should look.

New naming on our font-styles:

  • Heading XXL - Heading XS for desktop, tablet & mobile.

We will work on the guidelines more in detail when it comes to the use of the styles in our digital channels.

Sentence case

We always use sentence case text. This means that the capitalization is just like a standard sentence e.g. "Welcome to our bank".

We avoid using ALL CAPS. This is usually used to differentiate a word or text from another. If you need to create typographical hierarchies, use different font weights, sizes or colours instead.

Accessibility

We primarily use left-aligned typography. Aligned left (or ragged right) is the most readable alignment - it provides the eye with a common starting point for each line. Make sure the lines aren't too long. A line of text shouldn’t be longer than 80 characters.

In some cases, centered text is allowed. This is usually in digital contexts or in situations where it helps to present information in a more logical way than left-aligned text. This is only suitable for shorter texts of single words.

Do's and don'ts

Do
  • Try to limit the font sizes to 2-3
Don't
  • Do not use ALL CAPS, not even on single WORDS.

 

Specification

 

Subsections

Page last updated

Feedback

Was this helpful?