Till sidans huvudinnehåll

Ikoner

Göteborgs Stads ikoner används som ett komplement till text och för att göra det lättare att navigera i olika gränssnitt, kanaler eller rum. Vi skapar igenkänning och enhetlighet i kommunikationen genom att använda stadens ikoner och följa stadens manér.

Ikoners funktion

Ikoner är konkreta, förenklade bilder som ska fylla en funktion i att förtydliga sammanhang eller förenkla budskap. Vissa ikoner är mindre specifika och består av symboler för att förklara ett begrepp.

  • Ikoner ska föreställa det den avser (ett begrepp, ett objekt eller en funktion) och vara vägledande.
  • Använd inte ikoner som dekoration eller logotyp.
  • Ikoner har en fast funktion eller betydelse.

Ikoners utformning

Göteborgs Stad har en uppsättning med ikoner för kommunikationsmaterial. Använd i första hand de ikonerna. De finns att ladda ner längst ned på sidan och i mediabanken.

Göteborgs Stads ikoner görs i första hand i stadens linjemanér, precis som stadens illustrationer som beskriver och förklarar något:

  • Ikonerna har enkla, geometriska former och tydliga linjer med rundat avslut. Undantaget är webbikoner och app-ikoner som behöver fungera i väldigt små storlekar.
  • Ikoner ska vara lätta att läsa av i kontrast och form då de fungerar som ett komplement till text.
  • Ikoner ska främst göras i svart eller vitt. Valet avgörs av bakgrunden.

Exempel på de olika kategorierna av ikoner som används i staden: Kommunikation, webb, appar och piktogram för skyltar.

De olika kategorierna av ikoner och piktogram som används i staden. Läs mer om de olika kategorierna nedan.

Färgpalett som visar att svarta ikoner ska placeras mot ljusa färger och vita mot mörka färger.

Färgpalett som visar hur svarta respektive vita ikoner ska placeras mot stadens färger.

Ikoner i kommunikationsmaterial

I Göteborgs Stad finns en uppsättning ikoner som har samma betydelse eller funktion oavsett vilken kommunikation du tar fram. Ikonerna är gjorda utifrån stadens linjemanér för igenkänning i alla kanaler.

Ett urval av ikoner för kommunikationsmaterial, för e-post, fokusområde, tyck till, besök, gemensamma arbetssätt, hälsa, telefon, syfte och tillgänglighet.

Exempel på några av ikonerna.

Användning av ikoner

Gör så här!

Exempel på hur ikoner ska användas: Enfärgade svart eller vita mot enfärgad bakgrund tillsammans med text.

  • Placera alltid vägledande ikoner tillsammans med en text som förklarar innehållet.
  • Placera vita ikoner mot mörka färger och svarta ikoner mot ljusa färger.

Gör inte så här!

Exempel på hur du inte ska används ikoner: för dålig kontrast, för tunna linjer, färg som är svår att läsa av.

  • Placera inte vita ikoner mot ljusa färger eller svarta ikoner mot mörka färger.
  • Ha inte för tunn eller tjock linjetjocklek så att ikonen blir svår att läsa av.
  • Använd inte färg som blir svår att läsa av i ikonen. Läs mer på sidan Färg.

Webbikoner för digitala gränssnitt

Webbikoner ska föreställa det den avser, till exempel skrivare för att skriva ut. Ikonerna frångår linjemanéret för att fungera i väldigt liten storlek i digitala gränssnitt.

Ett urval av webbikoner för exempelvis ljud, kalender, teckenspråk, dokument, bild och så vidare.

Exempel på några av webbikonerna för digitala gränssnitt. 

Användning av webbikoner

Exempel på hur webbikoner placeras i digitala gränssnitt.

Exempel på webbikoner placerade i ett digitalt gränssnitt.

Favicon goteborg.se 

Göteborgs Stads favicon används på goteborg.se och dess undersidor eller där Göteborgs Stad står som huvudavsändare. Mejla enheten visuell kommunikation för att få tillgång till faviconen i png-format i flera storlekar. 

Faviconen placerad i adressfält, startsidor och i webbläsarens flik.

Faviconen är den ikon som ligger i webbläsarensflik, adressfält och på startsidor. Storlek och utformning kan variera beroende på webbläsare, program och enhet. 

App-ikoner

För att app-ikoner ska bli extra tydliga för användaren i jämförelse med andra appar kan tjockleken på linjer behöva vara grövre än de vanliga ikonerna. Ibland kan även ytor behöva fyllas. Tänk på att app-ikoner ska fungera i flera storlekar. App-ikoner görs i stadens komplementfärger, se nedan.

Exempel på appikoner för parkering: ett stort P, kalendarium: en kalender, badplatser: en person som simmar och återvinnlig: tre pilar i en cirkel.

Exempel på olika utformning av app-ikoner. 

Färgpalett som visar hur svarta app-ikoner ska placeras mot ljusa färger och vita app-ikoner mot mörka färger.

Färgpalett som visar utformning av app-ikonerna i svart eller vitt mot stadens färger.

Användning av app-ikoner

Exempel som visar en app-ikon för återvinning placerad i tre storlekar på en mobil.

Exempel på en app-ikon som fungerar i tre storlekar med god kontrast.

Läs mer om appar på sidan Webbsidor och appar.

Piktogram för skyltar och rum

För piktogram, både ute och inne, kan du använda Göteborgs Stads piktogram eller följa svensk standard. Piktogrammen har en fast betydelse och ersätter och stödjer skrift- och talspråket. Göteborgs Stads piktogram är gjorda enligt vårt linjemanér för illustration och ikoner. Piktogrammen finns i stadens mediabank och här i manualen på sidan Skyltar

Mejla enheten visuell kommunikation för att få tillgång till original med versal text och plats för punktskrift.

Ett urval av stadens piktogram i linjemanér, exempelvis för toalett, information och bastu.

Piktogram framtagna enligt Göteborgs Stads linjemanér. För taktila skyltar ska tillhörande text i versaler synas på skylten för att texten ska kunna läsas med fingrar. Vissa skyltar ska även ha blindskrift.

Om du använder svensk standard behöver du en licens. Varje förvaltning behöver ha en egen licens för användning av piktogram enligt svensk standard. Stadens upphandlade leverantörer har licens och original för piktogram enligt svensk standard och använder den vid produktion. Internationellt förekommande piktogram definieras i en internationell standard. 

Ett urval av piktogram enligt svensk standard, exempelvis för toalett, information och bastu.

Svensk standard för piktogram. Skyltleverantörer har licens för svensk standard. Ska du själv använda piktogrammen i produktion behöver din verksamhet eller förvaltning ha en licens.

Andra aktörers ikoner

Till andra aktörers ikoner räknas tjänster som kommer från annan leverantör, men som används inom staden. Det kan vara till exempel en programvara, en extern tjänst eller system. Den här typen av ikoner ska inte ersättas med nya eller egna framtagna ikoner. 

Tillgång till ikonerna

Använd i första hand ikonerna som finns att ladda ner här och i mediabanken.

För dig som är anställd i Göteborgs Stad: Läs mer om mediabanken på intranätet Digitala navet.

Göteborg Stads piktogram hittar du i mediabanken och på sidan Skyltar.

Ladda ner ikoner för kommunikationsmaterial

Göteborgs Stads ikoner samlade, CMYK (PDF)

Göteborgs Stads ikoner samlade, RGB (PPT)

${loading}