Alle Tools Kostenlos

Konvertieren Sie px, rem, em, pt und % mit einer Live-Tabelle und kopierfertigem CSS

Umzurechnender Wert
px
px

rem bezieht sich auf die Wurzel-Schriftgröße; em und % beziehen sich auf das übergeordnete Element.

Umgerechnete Werte
px
0
rem
0
em
0
pt
0
%
0
Gängige Werte
PXREMEMPT
10
12
14
16
18
20
24
28
32
40
48
64
CSS-Snippet

						

Über Pixel-zu-EM/REM-Konverter

Der Pixel-zu-EM/REM-Konverter übersetzt CSS-Längenwerte zwischen px, rem, em, pt und Prozent. Geben Sie einen Wert in einer der fünf Einheiten ein, und eine Live-Tabelle zeigt das Äquivalent in allen anderen — plus ein kopierbares CSS-Snippet, das Sie direkt in ein Stylesheet einfügen können.

Die Umrechnungen berücksichtigen, wie CSS Einheiten tatsächlich auflöst: rem bezieht sich auf die Root-Schriftgröße, während em und % sich auf die Schriftgröße des übergeordneten Elements beziehen. Beide Referenzgrößen sind editierbar, sodass Sie eine 16-px-Root mit einer 14-px-Komponente modellieren können, oder jede beliebige Skala Ihres Design-Systems.

Eine Tabelle gängiger Werte bildet die Größen ab, die Designer am häufigsten verwenden — sodass Fragen wie „was ist 24px in rem“ auf einen Blick beantwortet werden. Das Tool ist kostenlos, aktualisiert sich beim Tippen und ist ein Standardwerkzeug, um feste Pixel-Mockups in zugängliches, skalierbares rem-basiertes CSS umzuwandeln.

So verwenden Sie Pixel-zu-EM/REM-Konverter

  1. Geben Sie den umzurechnenden Wert ein und wählen Sie seine Einheit: px, rem, em, pt oder %.
  2. Passen Sie die Root-Schriftgröße (für rem) und die übergeordnete Schriftgröße (für em und %) an, falls sie von 16 px abweichen.
  3. Lesen Sie die umgerechneten Werte in der Live-Tabelle.
  4. Kopieren Sie das generierte CSS-Snippet oder einen beliebigen Wert aus der Tabelle gängiger Werte.

Häufig gestellte Fragen

rem bezieht sich immer auf die Schriftgröße der Root (html), während em sich auf die vererbte Schriftgröße des aktuellen Elements bezieht. Verschachtelte em-Werte kumulieren sich, weshalb rem für Layouts meist vorhersehbarer ist.

Bei der Standard-Root-Schriftgröße von 16 px entsprechen 16 px genau 1 rem. Ändern Sie das Feld für die Root-Größe, und der Konverter berechnet neu — bei einer 18-px-Root werden 16 px zu etwa 0,889 rem.

rem-Werte skalieren, wenn Nutzer die Basis-Schriftgröße ihres Browsers ändern, sodass der Text für Menschen lesbar bleibt, die größere Schrift benötigen. Feste px-Größen ignorieren diese Präferenz, was der Barrierefreiheit schadet.

CSS definiert 1 pt als 1/72 Zoll und 1 px als 1/96, also 1 pt = 1,333 px und 12 pt = 16 px. Punkte kommen hauptsächlich in Druck-Stylesheets und aus Textverarbeitungsprogrammen importierten Dokumenten vor.

Bei der Schriftgröße bezieht sich % auf die Schriftgröße des übergeordneten Elements, genau wie em: 100 % entspricht der Elterngröße, also sind 87,5 % von 16 px Elterngröße gleich 14 px. Stellen Sie das Feld für die Elterngröße auf Ihren Kontext ein.


Beliebte Suchen
px zu rem konverter px zu em konverter pixel zu rem rem zu px css einheiten konverter px em rem rechner
Brauchen Sie Hilfe?
Ein Problem mit diesem Tool gefunden? Sagen Sie es unserem Team.
Problem melden

Füge dieses kostenlose Tool zu deiner eigenen Website hinzu — kopiere den Code unten und füge ihn ein.