Online Tool Store
Letterafstand Voorvertoning
Bekijk de letterafstand in px, em of rem met instellingen voor lettertype, dikte en transformatie, en kopieer daarna de exacte CSS. Werkt in je browser.
Deze tool werkt volledig in je browser. Je bestanden worden nooit naar een server geüpload.
Zo werkt de letterafstand-voorvertoning
- Typ je voorbeeldtekst en pas letterafstand, lettergrootte, gewicht, lettertype en tekst-transformatie aan.
- Wissel de spatiëringseenheid tussen em, px en rem, passend bij hoe het stylesheet van jouw project is geschreven.
- Bekijk hoe de live voorvertoning bijwerkt terwijl je de spatiëringsschuif versleept.
- Kopieer de resulterende CSS-declaraties naar je stylesheet, of klik op Reset om opnieuw te beginnen.
Veelgestelde vragen
Waarvoor wordt letter-spacing gebruikt?
Om de ruimte tussen tekens (tracking) aan te passen voor betere leesbaarheid, nadruk in koppen, of een specifieke typografische stijl zoals brede, hoofdletter-labels.
Wat is een typisch bereik voor letter-spacing?
Kleine negatieve waarden (zoals -0.02em) maken grote weergavetekst strakker, terwijl positieve waarden (0.05em tot 0.2em) gebruikelijk zijn voor labels in hoofdletters en badges. Zeer brede spatiëring (0.3em+) wordt gebruikt voor stilistische nadruk.
Heeft lettergewicht invloed op hoe letter-spacing eruitziet?
Ja - vettere gewichten hebben van nature bredere lettervormen, dus dezelfde letter-spacing-waarde kan strakker of losser lijken afhankelijk van het gekozen gewicht en de grootte.
Kan ik de CSS direct in mijn project kopiëren?
Ja - de gegenereerde declaraties voor letter-spacing, font-size, font-weight, font-family en text-transform zijn klaar om in je stylesheet te plakken.
Moet letter-spacing in px, em of rem staan?
em is de meest gebruikelijke keuze omdat het meeschaalt met de eigen font-size van het element, waardoor de tracking proportioneel blijft als de tekst van grootte verandert. rem schaalt mee met de basislettergrootte, wat handig is als je consistente spatiëring wilt over verschillende tekstgroottes. px is het meest voorspelbaar, maar schaalt helemaal niet mee. Met deze tool kun je alle drie bekijken en kopiëren.
Welke letter-spacing werkt het best voor tekst in hoofdletters?
Labels en knoppen in hoofdletters lezen meestal beter met iets bredere tracking (ongeveer 0.05em tot 0.15em) om te compenseren voor hoe dicht hoofdletters op elkaar staan. Gebruik de tekst-transformatie om je tekst in hoofdletters te bekijken voordat je een waarde kiest.
Hoe we ons verhouden
| Feature | Online Tool Store | Letter-spacing rekenmachines | Eenheden-omrekentools |
|---|---|---|---|
| Live schuifregelaar-voorvertoning | ✓ | ✓ | ✗ |
| em / px / rem eenheidswissel met correcte omrekening | ✓ | ✗ | ✓ |
| Lettertypekiezer in de live voorvertoning | ✓ | ✗ | ✗ |
| Tekst-transformatie-voorvertoning (hoofdletters/kleine letters/beginletter hoofdletter) | ✓ | ✗ | ✗ |
| Direct kopieerbare CSS | ✓ | ✓ | ✓ |
Handig om de exacte tracking-waarde voor een kop of knoplabel te bepalen voordat je die in je CSS zet.