Tools Blog

Letter Spacing Tool

Kalibreer letterafstand, woordafstand en regelhoogte met live preview en vooraf ingestelde stijlen.

6 presetspx / em / remKopieer CSS direct

① Pas letterafstand, regelhoogte en lettergrootte aan ② Live voorbeeld bekijken ③ Kopieer de CSS-waarden

Presets
Letterafstand0em
Woordafstand0em
Regelhoogte1.6
Lettergrootte (px)16px
Lettergewicht
Lettertypefamilie
Teksttransformatie

Typography is the art and technique of arranging type. Good spacing creates rhythm, hierarchy, and visual comfort for the reader.

CSS-uitvoer
letter-spacing: 0em;
word-spacing: 0em;
line-height: 1.6;
font-size: 16px;
font-weight: 400;
font-family: DM Sans, sans-serif;
text-transform: none;

Wat is letter-spacing in CSS?

De CSS-eigenschap letter-spacing regelt de horizontale ruimte tussen individuele tekens (ook wel tracking genoemd in drukwerktypografie). Het accepteert positieve of negatieve waarden in px, em of rem. Het gebruik van em-eenheden heeft de voorkeur omdat de afstand proportioneel meeschaalt wanneer de font-size verandert.

De word-spacing-eigenschap voegt ruimte toe of verwijdert ruimte tussen woorden, terwijl line-height het verticale ritme bepaalt. WCAG 1.4.12 vereist dat er geen inhoud verloren gaat wanneer letter-spacing minstens 0.12em, word-spacing minstens 0.16em en line-height minstens 1.5 is.

Veelgestelde vragen

De CSS-eigenschap letter-spacing voegt uniforme ruimte toe tussen elk teken. In drukwerktypografie heet dit "tracking". Positieve waarden spreiden tekens; negatieve waarden brengen ze dichter bij elkaar.
Met em schaalt de afstand automatisch mee met de font-size. Bijvoorbeeld, letter-spacing: 0.05em bij 16px wordt 0.8px, maar bij 24px wordt het 1.2px — dezelfde visuele verhouding blijft behouden.
letter-spacing regelt de ruimte tussen individuele tekens. word-spacing voegt horizontale ruimte toe tussen woorden. line-height bepaalt de verticale afstand tussen tekstregels.
Vergroot letter-spacing voor: (1) hoofdlettertekst — heeft extra tracking nodig (0.05–0.15em); (2) kleine tekst zoals bijschriften; (3) display-koppen op zeer grote formaten voor een verfijnder uiterlijk.
Voor broodtekst is 1.5–1.7 optimaal. Koppen kunnen 1.1–1.3 gebruiken. Bijschriften werken goed op 1.4. WCAG 1.4.12 beveelt minstens 1.5 aan voor broodtekst.
Ontwerpers gebruiken nauwkeurige afstanden voor: merkstijlgidsen, CSS-componentbibliotheken, redactioneel ontwerp met display-lettertypen, WCAG 1.4.12-toegankelijkheidsaudits.
WCAG 2.1 SC 1.4.12 vereist dat er geen inhoud verloren gaat bij: letter-spacing minstens 0.12em, word-spacing minstens 0.16em, line-height minstens 1.5, ruimte na alinea's minstens 2em.
Gerelateerde Artikelen
CSS 5 min leestijd
px, rem, em, vh: Wanneer elke CSS-eenheid gebruiken
Praktische gids voor CSS-eenheden: wanneer px, rem, em, vh en vw gebruiken. Met uitleg over toegankelijkheid en een snelle conversietabel.

Ontdek ons netwerk

ntool.io Gratis netwerkdiagnose-tools — ping, traceroute, DNS-lookup, poortscanner en meer Bezoeken → capops.io Gratis financiële rekenmachines — samengestelde rente, hypotheek, pensioenplanning, investeringstools en meer Bezoeken →