Document toolboxDocument toolbox

Design guidelines

These guidelines outline the general rules of design when offering xID as a login alternative at your website. Consistent use helps people recognise xID and understand how the product works, and this part of the documentation is ment to support this.

Logos

The xID logo is used to represent the product xID, and should be used in a digital context when writing about xID on your website or on buttons.

The logo mainly comes in two different variations:

  • Primary logo: With supporting text "Av BankID" - both in English and Norwegian
  • Secondary logo: Plain (without supporting text)

The background colours and the logo are in different combinations of green, grey and white. Green is the primary colour, and grey is the secondary colour.
The following formats are supported: JPG, PNG, SVG

If you need a smaller logo for special use or logos for print, please contact Head of communications at hege.steinsland@bankidnorge.no

Primary logo with supporting text:

White logo:

Coloured logo: 

Secondary logo without supporting text:

White logo:

Coloured logo:

Design guidelines document

This is a document that describes how to use the logos, colours and fonts in more detail. Please read the document for more instructions on design.

xID_Profilmanual_2017.pdf

 Only in Norwegian

Login button

The preferred design for the login button is to use only the logo without the supporting text. Please follow the guidelines below to build your own login button.

In genereal, use the logo files without supporting text for buttons.

Colour

Use the following combinations if you want to use the logo on the button: 

  • Green background with white logo
  • Grey background with white logo
  • White background with green logo

Please use the colours as specified in the design guidelines.

Another option is to not use the logo. Then you will have to write xID with letters instead of the logo, but you can use the background colour of your choosing.

Text

We recommend that you use one of the following texts for the button, depending on which usecase for xID you are considering.

Norwegian
English
Logg inn med xIDLogin with xID
Fortsett med xID

Continue with xID

Fyll ut med xIDPrefill with xID
Registrer deg med xIDSign up with xID

Among social login buttons

When xID is presented with other login alternatives e.a. social logins, the following design ensures a consistent design and experience: