Opas 07 · Valinta

Näin valitset toimivan fonttiparin

Fonttipari toimii, kun lukija huomaa hierarkian mutta ei joudu ihmettelemään, miksi kaksi eri maailmaa osui samalle sivulle.

Päivitetty 29.8.2026 · 5 min lukuaika

Lyhyt vastaus

Anna fonteille eri roolit ja etsi yksi selkeä kontrasti. Pidä samalla x-korkeus, mittasuhteet tai tunnelma riittävän yhteensopivana.

01

Aloita tehtävistä, älä nimistä

Päätä ensin, kumpi fontti kantaa pitkän tekstin ja kumpi luo otsikoiden ilmeen. Leipätekstin vaatimukset rajaavat valintaa enemmän, joten se kannattaa valita ensin.

02

Valitse yksi näkyvä ero

Serif ja sans serif on helppo kontrasti, mutta myös kapea ja leveä, rauhallinen ja geometrinen tai kevyt ja vahva voivat toimia. Jos fontit ovat lähes samanlaiset, ero näyttää helposti vahingolta.

Tarkistuslista
  • Vertaa samaa otsikkoa ja kappaletta rinnakkain.
  • Sovita optiset koot; sama CSS-koko ei aina näytä samankokoiselta.
  • Käytä aluksi vain yhtä tai kahta painoa per perhe.
  • Testaa pari mobiilissa ennen lopullista päätöstä.

03

Yksi perhe voi olla paras pari

Laaja superperhe tai muuttuva fontti tarjoaa usein riittävän hierarkian ilman toista perhettä. Leveys, paino ja koko voivat erottaa otsikon ja tekstin samalla kun kirjainmuotojen yhteys säilyy.

Lähteet

Alkuperäiset lähteet