Pixel naar EM/REM-omzetter
Zet px, rem, em, pt en % om met een live tabel en kopieerklare CSS
rem is relatief aan de wortel-lettergrootte; em en % zijn relatief aan de bovenliggende.
| PX | REM | EM | PT |
|---|---|---|---|
| 10 | — | — | — |
| 12 | — | — | — |
| 14 | — | — | — |
| 16 | — | — | — |
| 18 | — | — | — |
| 20 | — | — | — |
| 24 | — | — | — |
| 28 | — | — | — |
| 32 | — | — | — |
| 40 | — | — | — |
| 48 | — | — | — |
| 64 | — | — | — |
Over Pixel naar EM/REM-omzetter
De pixel-naar-EM/REM-converter zet CSS-lengtewaarden om tussen px, rem, em, pt en procent. Voer een waarde in een van de vijf eenheden in en een live tabel toont het equivalent in alle andere — plus een direct kopieerbaar CSS-fragment dat je zo in een stylesheet kunt plakken.
De omrekeningen respecteren hoe CSS eenheden daadwerkelijk oplost: rem is relatief aan de fontgrootte van de root, terwijl em en % relatief zijn aan de fontgrootte van het bovenliggende element. Beide referentiegroottes zijn aanpasbaar, zodat je een root van 16 px met een component van 14 px kunt modelleren, of elke andere schaal van je ontwerpsysteem.
Een tabel met veelgebruikte waarden toont de groottes die ontwerpers het vaakst nodig hebben — zodat vragen als "wat is 24px in rem" in één oogopslag beantwoord worden. De tool is gratis, werkt bij het typen bij en is een vaste waarde voor het omzetten van vaste pixel-mockups naar toegankelijke, schaalbare rem-gebaseerde CSS.
Hoe gebruik je Pixel naar EM/REM-omzetter
- Voer de om te zetten waarde in en selecteer de eenheid: px, rem, em, pt of %.
- Pas de fontgrootte van de root (voor rem) en van het bovenliggende element (voor em en %) aan als deze afwijken van 16 px.
- Lees de omgezette waarden in de live tabel.
- Kopieer het gegenereerde CSS-fragment of een waarde uit de tabel met veelgebruikte waarden.