Icons

Join us in collaborating on icons!

Nav has created a robust set of icons (800+) that we recommend using and contributing to further develop. We believe there are only advantages to having icons carry the same meaning across different public sector contexts.

The icons support size adjustment and colour changes, and are available in both stroke and fill variants.

Here you can find the icon overview: aksel.nav.no/ikoner
Here you can download the icon package: cdn.nav.no/aksel/icons
Here you can find the NPM package: @navikt/aksel-icons
Here you can find the icons in Figma: Core Icons 3

To keep the icon package in Figma in sync with new updates and adjustments, you need a plugin: Aksel Icon plugin.

Install the plugin, click "Run" and you'll download the latest changes. Many thanks to the design system team at NAV who made this possible! 🙏🏻👏🏻🏅

Click the image or press Escape to close

How to contribute

Join us and contribute here! Follow these guidelines when creating new icons:

• Use the Keyline template found in the Figma file under "Assets" Core Icons 3
  
• All layers (even if there's only one) must be grouped in a group, either union, subtract, intersect, or exclude
• The top group should have the colour icon.default, all layers and groups below this should only use #262626
• All layers and groups should be set to Constraints: scale, scale
• For the "Stroke" icon variant: The icon must consist of only lines, the lines should be 1.5 px, centre
• For the "Filled" icon variant: Icons where shapes can be filled, should be filled

Accessibility

The icons should work for all users, regardless of their situation. Read more about how to ensure accessibility when using icons and which aria attributes you should use.