Radhöjdskalkylator
Kalkylatorn rekommenderar radavstånd, teckenavstånd och en idealisk maximal styckebredd för en fontstorlek och ett användningsområde – brödtext, rubriker, UI-etiketter eller displaytext – med förhandsvisning i realtid och CSS-kod.
Om verktyget
Kalkylatorn rekommenderar radavstånd, teckenavstånd och en idealisk maximal styckebredd för en fontstorlek och ett användningsområde – brödtext, rubriker, UI-etiketter eller displaytext – med förhandsvisning i realtid och CSS-kod.
Så använder du det
- Ange fontstorleken i pixlar.
- Välj stil: brödtext, rubrik, UI-etikett eller display.
- Kolla exempelstycket och de fyra rekommenderade värdena.
- Klicka på Copy CSS för att föra över värdena till din stilmall.
Bra att veta
- Brödtext är bekväm att läsa med ett radavstånd på ungefär 1.5–1.6 gånger fontstorleken.
- Stora rubriker och displaytext ser bättre ut med tätare radavstånd, ungefär 1.05–1.2.
- En läsvänlig radlängd är ungefär 45–75 tecken per rad.
- WCAG 1.4.12 kräver att innehållet fortfarande fungerar när användare ställer in radavståndet på 1.5 och teckenavståndet på 0.12 em.
- Enhetslösa line-height-värden (som 1.6) skalas med varje elements fontstorlek.
Körs helt i din webbläsare – inget du skriver in laddas upp eller sparas.
Vanliga frågor
Vilket radavstånd är bra för brödtext?
Omkring 1.5 till 1.6 gånger fontstorleken. För text på 16 px blir det ungefär 24–26 px.
Ska rubriker ha mindre radavstånd?
Ja. Stor text behöver mindre relativt avstånd, så rubriker använder oftast 1.1–1.3 och displaytext ännu tätare.
Vilken radlängd är idealisk för läsning?
Ungefär 45–75 tecken per rad, där omkring 65 ofta nämns som idealiskt för brödtext.
Ska jag använda enhetslös line-height i CSS?
Oftast ja. Ett enhetslöst värde som 1.6 ärvs som en kvot, så underordnade element med andra fontstorlekar får proportionerligt avstånd.