Värit
Väripaletti
Käytämme kaikessa viestinnässä ja markkinoinnissa Työtiksen sinistä, 50% turkoosia, 20 % turkoosia ja valkoista sekä vadelmaa piristävänä aksenttivärinä.
Sinisen ja turkoosin lisäksi käytämme paljon valkoista tilaa ja valkoista tekstiä sinistä taustaa vasten. 50 % turkoosi toimii tukivärinä.
#003C78
R 0, B 60, G 120
C 100, M 60, Y 0, K 40
#CCEFF4
R 204, G 239, B 244
C 18, M 0, Y 4, K 0
#7FD7E4
R 127, G 215, B 228
C 45, M 0, Y 12, K0
#00A3BD
R 0, G 163, B 189
C 77, M 16, Y 21, K 0
#FF5C5C
R 255, G 92, B 92
C 0, M 79, Y 57, K 0
#FFFFFF
Värien saavutettavuus
Jos värien kontrastiarvo on 3-4.5 täytyy tekstin olla suurikokoista tai lihavoitua. Huomaa, että turkoosin ja valkoisen yhdistelmä on kielletty tekstissä ja tietoa välittävässä grafiikassa.
Sininen #003C78
Valkoinen #FFFFFF
Turkoosi 20 % #CCEFF4
Sininen #003C78
Turkoosi 50 % #7FD7E4
Sininen #003C78
Turkoosi 100 % #00A3bD
Sininen #003C78
Vadelma #FF5C5C
Valkoinen #FFFFFF
Sininen #003C78
Valkoinen #FFFFFF
Laki digitaalisten palveluiden tarjoamisesta (306/2019) velvoittaa Työterveyslaitosta noudattamaan WCAG 2.1 -ohjeistuksen A- ja AA-tason mukaista saavutettavuutta. Noudatamme tätä kaikissa digitaalisissa palveluissamme ja aineistoissamme.
AA-tasolla normaalikokoisen tekstin (≤18 pt/24 px tai lihavoituna ≤14 pt/19 px) ja taustan kontrastiero tulee olla vähintään 4.5:1. Isokokoisessa tekstissä (≥18 pt/24 px) tai lihavoidussa tekstissä (≥14 pt/19 px) kontrasti on vähintään 3:1. Sama kontrastisuhde tulee olla myös olennaista informaatiota sisältävässä grafiikassa ja kuvakkeissa.
Turkoosin ja valkoisen yhdistelmä on kielletty. Turkoosin ja valkoisen kontrastiero on 3.01:1. Siksi emme käytä turkoosia tekstiä valkoisella taustalla tai valkoisia tietoa välittävää grafiikkaa tai tekstiä turkoosilla pohjalla.
Kontrasti on hyvä tarkistaa siihen tarkoitetulla työkalulla, joita löytyy verkosta useita erilaisia (esimerkiksi tämä englanninkielinen WebAIM:in selainpohjainen ja maksuton työkalu).
Tekstin väri
Otsikoiden, väliotsikoiden ja korostusten väri valkoisella taustalla on joko Työtiksen sininen tai musta. Linkkivärimme valkoisella taustalla on sininen.
Sinisellä taustalla teksti voi olla valkoista tai 20- 50 % turkoosia ja 50 % turkoosilla taustalla sinistä, ei mustaa.
Kuvaajien väritys
Tutustu tarkemmin tiedon visualisoinnin väriohjeisiin sivulla Tiedon visualisointi.
Piirroskuvien väritys
Piirroskuvissa ei ole välttämätöntä pitäytyä ainoastaan Työtiksen brändiväreissä ja niiden eri sävyissä, mutta kokonaisuuden on perustuttava pääasiassa meidän väreihimme ja toteutuksen on istuttava raikkaaseen, kirkkaaseen ja iloiseen värimaailmaamme.