Väripaletit
Kela Design Systemin värijärjestelmä perustuu kolmeen eri väripalettiin: pääväreihin, tilaväreihin ja lisäväreihin. Kun värejä käytetään ulkoasussa johdonmukaisesti, verkkopalvelu näyttäytyy tunnistettavana ja yhtenäisenä.
Päävärit Kannan verkkopalveluissa
Kannan visuaalisen verkkoilmeen väripaletti perustuu Kannan brändikirjan väreihin, jotka toimivat brändin visuaalisen ilmeen perustana.
Kanta-brändin värit pohjautuvat luonnon raikkaisiin sävyihin – sävyihin, jotka ovat yhteisiä koko Suomelle. Sama symbolinen ajatus koskee Kantaa, joka yhdistää meitä kaikkia ja on meidän kaikkien käytössä. Väreillä halutaan kommunikoida Kannalle keskeisiä arvoja: uskottavuutta, luotettavuutta, terveyttä, hyvinvointia ja ihmisläheisyyttä.
Kannan verkkoilmeen pääväreinä käytetään Kanta-brändikirjasta johdettua petroolia ja kirkasta vihreää. Valkoista käytetään suurina pintoina ja taustavärinä. Petroolista ja vihreästä on erikseen osoitettu sävyt, jotka yhdistyvät tunnistettavasti Kannan brändi-ilmeeseen. Sävyt on kuvattu pyöreällä muodolla.
Harmaan eri sävyjä voidaan käyttää yksityiskohdissa, joissa sovelletaan matalaa kontrastia ja visuaalisesti kevyttä tyyliä (taustasävyt, reunaviivat ja erottimet). Harmaan tummimpia sävyjä voidaan käyttää myös tekstissä.
kanta-blue
10
20
30
40
50
60
70
80
90
100
kanta-green
10
20
30
40
50
60
70
80
90
100
kanta-gray
10
20
30
40
50
60
70
80
90
100
black
black
white
white
Tilavärit
Tilavärejä verkkoilmeessä käytetään toiminnalliseen tarkoitukseen – ne voivat varoittaa, viestiä virhetilanteesta tai ilmoittaa toiminnon onnistumisesta. Verkkokäyttöön suunniteltujen tilavärien tulee olla toisistaan selkeästi erottuvia ja värikylläisiä, jolloin ne toimivat parhaiten käyttäjää opastavassa roolissa.
Onnistumisesta viestivä vihreä on sama kuin tehosteena käytettävä vihreän väri. Varoitusta viestivä keltainen ja virhettä viestivä punainen on muodostettu brändikirjan lisävärien keltaisesta ja lohenpunaisesta. Petroolin sävyjä voi lisäksi käyttää neutraalien tilojen kuvaamiseen.
kanta-blue
10
20
30
40
50
60
70
80
90
100
kanta-success-green
10
20
30
40
50
60
70
80
90
100
kanta-warning-yellow
10
20
30
40
50
60
70
80
90
100
kanta-warning-red
10
20
30
40
50
60
70
80
90
100
Lisävärit
Lisävärejä verkkoilmeessä käytetään tyypillisesti kuvittavissa elementeissä sekä tietoa välittävässä merkityksessä infografiikoissa.
Kannan verkkoilmeen lisävärejä ei ole vielä määritelty. Lisävärit suunnitellaan myöhemmin – alustavasti ensimmäinen versio lisäväreistä toteutetaan vuoden 2024 aikana.