Icons

With Designsystemet, you can choose which icon set to use. By default, Designsystemet uses Nav's icon set, which is open to use and contribute to. You are completely free to choose other icon libraries that better match your organisation's or product's visual identity.

How to connect the icons to your Figma library

When you download our Community file, it is connected to our internal version of Aksel Icons. To use the icons in your own files, you need to connect them to a library in your own Figma organization.

How to use Aksel icons

1. Download Aksel icons (Figma)
2. Publish the icon set as a library in Figma
3. Open Manage libraries and select the icon library under Missing libraries
   Then use Swap library (Figma) to replace the icons in the Community file

How to use another icon library

If you want to use a different icon library than Aksel, the icons need to be adapted so they can replace the icons in Designsystemet.

Procedure:

Below you will find two tables with icon names and corresponding icons:

• Meaningful icons should be replaced with variants that are as similar as possible to Aksel
• Non-meaningful icons are used as placeholders, for example in buttons, and can be replaced freely

If you use version 1.8.0 or earlier of the Community file, you will see more icons in Swap library than those listed in the tables. These are only used in examples and do not need to be replaced.

1. Preparation
   • Give your icons the same names as the corresponding Aksel icons. You only need to do this for the icons shown in the tables below
   • Add the color style color/neutral/text-default to the icons

2. Swap library

   • Use Swap library in Figma

3. Clean up

   • Change the icon names back to your preferred naming convention

4. Check colors

   • Check that the icons have the correct colors after the swap
   • If the colors are not preserved, they must be updated manually. See the overview of icon colors (Github)