1. Wpisz wartość
Wpisz liczbę w polu wejściowym. Możesz użyć kropki lub przecinka jako separatora dziesiętnego.
Przelicz em na piksele
Ten konwerter przelicza jednostki em na piksele i odwrotnie. Możesz ustawić font-size elementu nadrzędnego, a wynik pojawi się natychmiast.
Loading tool editor...
Czym jest em i kiedy warto przeliczać na piksele?
Jednostka em w CSS odnosi się do wielkości czcionki elementu nadrzędnego. Jeśli rodzic ma font-size 16 px, to 1 em = 16 px, 1,5 em = 24 px.
W odróżnieniu od rem, wartość em zmienia się w zależności od kontekstu. Jeśli nagłówek ma font-size 24 px, to padding 0,5 em na tym nagłówku = 12 px, a nie 8 px.
Jednostka em jest przydatna tam, gdzie wymiar ma skalować się proporcjonalnie do tekstu – np. padding wokół przycisku, odstępy w typografii, line-height.
Problem z em pojawia się przy zagnieżdżaniu elementów – efekt kumulacji (1,2 em × 1,2 em × 1,2 em…) może prowadzić do nieoczekiwanych rozmiarów. Dlatego dla font-size lepiej używać rem.
Jak korzystać z konwertera?
2. Odczytaj wynik
Wynik konwersji pojawi się natychmiast w polu obok – bez klikania żadnego przycisku.3. Skopiuj lub zmień kierunek
Kliknij Kopiuj wynik lub użyj przycisku Zmień kolejność, aby przeliczać w drugą stronę.
Kiedy przydaje się ten konwerter?
Typografia
Line-height 1,5 em = 150% rozmiaru czcionki rodzica.Przyciski
Padding w em skaluje się z rozmiarem tekstu przycisku.Komponenty
Wymiary proporcjonalne do tekstu w komponentach UI.CSS media queries
Breakpointy w em są odporne na zmianę bazowego font-size.
Co wyróżnia nasz konwerter?
Pełna prywatność
Wszystkie obliczenia odbywają się lokalnie w przeglądarce. Żadne dane nie są wysyłane na serwer.Wynik w czasie rzeczywistym
Wynik aktualizuje się natychmiast podczas wpisywania – bez konieczności klikania.Obustronna konwersja
Przycisk Zmień kolejność pozwala przeliczać w obu kierunkach jednym kliknięciem.Tabela popularnych wartości
Gotowa tabela z najczęściej przeliczanymi wartościami i opisami kontekstowymi.
Jak działa konwersja em na px?
Jednostka em w CSS jest relatywna i odnosi się do rozmiaru czcionki elementu nadrzędnego (rodzica). Jeśli element nadrzędny ma rozmiar czcionki 16 px (domyślna wartość przeglądarki), to 1 em = 16 px. Aby przeliczyć em na piksele, wystarczy pomnożyć wartość em przez rozmiar czcionki rodzica.
Na przykład jeśli rodzic ma font-size 20 px, to 1,5 em = 30 px. Kluczowa różnica między em a rem polega na tym, że em odnosi się do rodzica, a rem zawsze do elementu głównego (html). Oznacza to, że wartości em mogą się kumulować przy zagnieżdżaniu elementów.
Jednostka em jest szczególnie przydatna do definiowania paddingów, marginów i odstępów, które powinny być proporcjonalne do rozmiaru tekstu w danym kontekście. Konwerter pozwala ustawić dowolną wartość font-size rodzica.
Praktyczne wskazówki
- Używaj em do paddingów i marginów, które mają być proporcjonalne do tekstu.
- Używaj rem do font-size – unikniesz efektu kumulacji.
- Line-height: 1,5 em to standard dla tekstu czytelnego (WCAG).
- Media queries: em jest bardziej niezawodne niż px (respektuje zoom przeglądarki).
em vs px – porównanie
| Cecha | em | px |
|---|---|---|
| Typ | Relatywna (rodzic) | Absolutna |
| Odniesienie | font-size rodzica | Stała wartość |
| Zagnieżdżanie | Kumuluje się | Brak efektu |
| Zastosowanie | Padding, margin, line-height | Border, shadow, stałe wymiary |
| Media queries | Respektuje zoom | Nie respektuje zoom |
em
- Typ
Relatywna (rodzic) - Odniesienie
font-size rodzica - Zagnieżdżanie
Kumuluje się - Zastosowanie
Padding, margin, line-height - Media queries
Respektuje zoom
px
- Typ
Absolutna - Odniesienie
Stała wartość - Zagnieżdżanie
Brak efektu - Zastosowanie
Border, shadow, stałe wymiary - Media queries
Nie respektuje zoom
Konwertuj inne jednostki do px
Sprawdź konwertery innych jednostek
Najczęściej zadawane pytania
Pomóż nam ulepszyć narzędzia
Masz pomysł na nową funkcję, znalazłeś błąd lub chcesz zaproponować inne narzędzie? Napisz do nas – odpowiadamy w ciągu 24 godzin.