HomeOntwerptoolsLettertypecombinaties

Lettertypecombinaties

De font pairing-tool toont 12 geselecteerde Google Fonts-combinaties voor koppen en broodtekst, laat je zelf lettertypes combineren en kopieert de bijbehorende CSS @import.

The Art of Good Typography
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line-spacing, and letter-spacing.

Over deze tool

De font pairing-tool toont 12 geselecteerde Google Fonts-combinaties voor koppen en broodtekst, laat je zelf lettertypes combineren en kopieert de bijbehorende CSS @import.

Zo gebruik je het

  1. Kies een van de geselecteerde combinaties, of kies zelf een lettertype voor koppen en voor broodtekst.
  2. Gebruik Random Pairing om combinaties te ontdekken.
  3. Bekijk de live preview van kop en alinea.
  4. Klik op Copy CSS @import om de lettertypes op je site te laden.

Goed om te weten

  • Een klassieke combinatie zet een serif tegenover een sans-serif, zoals Playfair Display met Source Sans 3.
  • Combinaties zijn onder meer Montserrat + Merriweather, Raleway + Lato, Space Grotesk + Inter en DM Serif Display + DM Sans.
  • Door een site te beperken tot twee lettertypefamilies blijven pagina's consistent en wordt de downloadgrootte kleiner.
  • De preview laadt de gekozen lettertypes van Google Fonts in de gewichten 400 en 700.
  • Met display=swap in de font-URL wordt fallbacktekst getoond terwijl het webfont laadt.

Werkt volledig in je browser — niets wat je invoert wordt geüpload of opgeslagen.

Veelgestelde vragen

Welke lettertypes passen goed bij elkaar?

Lettertypes met contrasterende stijlen maar vergelijkbare verhoudingen combineren meestal goed, zoals een serif met veel contrast voor koppen en een strakke sans-serif voor broodtekst. De geselecteerde combinaties hier zijn beproefd.

Hoeveel lettertypes moet een website gebruiken?

Twee families, één voor koppen en één voor broodtekst, is genoeg voor de meeste sites. Een derde is zelden nodig.

Zijn Google Fonts gratis voor commercieel gebruik?

Ja. Lettertypes in de Google Fonts-bibliotheek vallen onder open licenties zoals de SIL Open Font License en mogen commercieel worden gebruikt.

Hoe voeg ik de lettertypes toe aan mijn site?

Plak de gekopieerde @import bovenaan je CSS, of zet hem om naar een link-tag in je HTML-head, en stel dan font-family in voor je koppen en body.