Ikoner

Bli med å samarbeide om ikoner!

Nav har laget et solid sett med ikoner (800+) som vi anbefaler å bruke og bidra til å videreutvikle. At et ikon har samme betydning i en offentlig sammenheng som en annen tror vi bare har fordeler.

Ikonene støtter justering i størrelse og fargeendringer, og kommer i både stroke og fill-varianter.

Her finner du oversikten over ikoner: aksel.nav.no/ikoner
Her kan du laste ned ikonpakken: cdn.nav.no/aksel/icons
Her finner du NPM-pakken: @navikt/aksel-icons
Her finner du ikonene i Figma: Core Icons 3

For å holde ikonpakken i Figma i sync med nye oppdateringer og justeringer som kommer trenger du en plugin: Aksel Icon plugin.

Installer pluginen, trykk "Run" og du henter ned de siste endringene. Tusen takk til designsystem-teamet i NAV som gjorde dette mulig! 🙏🏻👏🏻🏅

Klikk på bildet eller trykk Escape for å lukke

Slik bidrar du

Bli med å bidra her! Følg disse retningslinjene når du lager nye ikoner:

• Bruk Keyline-malen som du finner i Figma-filen under "Assets" Core Icons 3
  
• Alle lag (selv om det kun er ett) må grupperes i en gruppe, enten union, subtract, intersect, eller exclude.
• Den øverste gruppen skal ha fargen icon.default, alle lag og grupper under dette skal kun bruke #262626
• Alle lag og grupper settes til Constraints: scale, scale
• For ikonvarianten "Stroke": Ikonet må bestå av kun linjer, linjene skal være 1.5 px, center.
• For ikonvarianten "Filled": Ikoner hvor shapes kan fylles, skal fylles.

Tilgjengelighet

Ikonene skal funke for alle brukerene, uansett situasjon. Les mer om hvordan du sikrer tilgjengeligheten når du bruker ikoner og hvilke aria-attributter du bør bruke.