Colors and fonts

The base color of the intranet, your brand color, and font color are all set up under the respective theme: Site Settings / Appearance / Theme.

The intranet has a Content theme and a Header and Footer theme. Each theme has a dark variant which is activated for users who have chosen dark mode in their system settings.

The Header and Footer theme is used for coloring the header and footer. The colours used on the different areas are:

  1. Basic background colour, basic text colour
  2. Primary block colour
  3. Secondary block colour
  4. Primary block colour
  5. Standard block colour
Färgöversikt tema intranät.

All color settings are adjusted within the website’s themes.

The colour set in the Theme Content/ Element colors/ Danger is used by the crisis information function. This means that if you change that color, you will also change the color of the crisis banner.

You can customise all colors to match your branding, but please remember to use colors with sufficient contrast.

Besides the color settings, which you customize in the Configuration template (Customise intranet templates module) and under Website settings / Appearance / Theme / Website theme, there are predefined colors set up on the intranet that are used by different modules and functions. See the image below.

The colors named Site theme/ Primary - Site theme/ Danger are used by modules like the button module. The color Site theme/ Danger is also used for the color of the crisis banner.

When you change these colors according to your graphic profile, remember to use colors with sufficient contrast and we suggest to keep the names of the colors. That way you don't break the link with the website's theme.

Emergency banner

Customizing colors

1. To update a color, go to Site Settings and click on the Colors panel (located under the Appearance category).

Site settings - Colors

2. Double-click the color you want to change. Change the color by entering HEX code or RGB values. Click OK.

3. Click OK to save and activate your changes when you leave the site settings.

Fonts and web fonts

Is your intranet delivered before October 2022? Then you have a web font assistant in the configuration template. By default, the font Encode is set in the web font assistant.

If your intranet is set up from October 2022, the corresponding web font is set up under Website settings / Appearance / Web fonts instead.

If you prefer to use one of the standard web-safe fonts (Arial, Courier new, Georgia, Helvetica, Times new roman orVerdana), set it as the default font in the website themes instead of Theme font.

You make this setting under Site settings / Appearance / Theme / Theme settings/ Basic.

Site settings - Theme - Basic

If you wish to upload your own font, you should use Web Fonts. Please ensure you have access to the font files you require, and that they are in woff2 format.

Then, go to Site Settings / Appearance / Web Fonts.

Upload the variants of the font that you need. The easiest method is to update and replace existing files, retaining the name ‘Theme Font’. This means you won’t need to adjust the setting in the website’s base themes.

If you want to use several fonts, you can upload further font families (or combine them with standard fonts) and specify them in the relevant text settings within each theme.

You find further information on how to add web fonts on the help website.

The page published:

Did the information help you?

help.sitevision.se always refers to the latest version of Sitevision