Die Ergebnisse dienen nur zu Informationszwecken und können Fehler enthalten. Bitte überprüfen Sie wichtige Informationen unabhängig. Die Nutzung dieses Tools erfolgt auf eigene Gefahr.
Was dieses Tool macht
Der CSS-Einheiten-Konverter rechnet eine Länge zwischen px, rem, em, pt und % um. Geben Sie einen Wert ein, wählen Sie seine Einheit und legen Sie die Basisschriftgröße fest (standardmäßig 16px – der Wert, den Browser verwenden, solange der Benutzer ihn nicht ändert). Die Seite zeigt dann dieselbe Länge in allen fünf Einheiten an.
Die Umrechnungen folgen der CSS-Spezifikation: 1rem entspricht der Schriftgröße des Wurzelelements, bei einer Basis von 16px sind 1.5rem also 24px. Ein Punkt ist 1/72 Zoll und ein CSS-Pixel 1/96 Zoll, daher sind 12pt genau 16px. em und % werden hier gegen dieselbe Basis berechnet. Das entspricht einer Schriftgröße, die an einem Element gesetzt ist, dessen Elternelement die Wurzelgröße verwendet. Nichts verlässt Ihren Browser.
Wann Sie es verwenden
- Sie übertragen Pixelwerte aus einem Design-Mock-up in
rem, damit Text mit den Schrifteinstellungen des Benutzers skaliert. - Sie konvertieren ein Print-Stylesheet oder ein PDF-Design, das in Punkt angegeben ist.
- Sie prüfen, welchen Wert eine Schriftgröße in
%tatsächlich ergibt, wenn Sie fremdes CSS übernehmen. - Sie bauen eine typografische Skala, bei der jede Stufe einen glatten
rem-Wert braucht.
Beispiel
Eingabe
24px, Basis 16pxAusgabe
px 24.000
rem 1.5000
em 1.5000
pt 18.000
% 150.00%Fragen zu diesem Tool
Sollte ich für Schriftgrößen rem oder px verwenden?
Verwenden Sie rem für Schriftgrößen und die meisten Abstände. Wenn jemand zur besseren Lesbarkeit die Standardschriftgröße im Browser erhöht, wachsen rem-Werte mit, während px-Werte fix bleiben.
Was ist der Unterschied zwischen rem und em?
rem bezieht sich immer auf die Schriftgröße des Wurzelelements (html). em bezieht sich auf die Schriftgröße des aktuellen Elements, bei verschachtelten Elementen multiplizieren sich die Werte also: 1.2em innerhalb von 1.2em ergibt das 1,44-Fache der Basis. Der Konverter berechnet beide gegen die Basis, die Sie eingeben.
Warum ist 1pt nicht gleich 1px?
CSS legt einen Zoll auf 96 Pixel fest, und ein Punkt ist 1/72 Zoll, daher entspricht 1pt 1,333px. Text in 12 Punkt aus einer Textverarbeitung ist im Web also genauso groß wie 16px.
Welche Basisgröße sollte ich eingeben?
Verwenden Sie 16, es sei denn, Ihr Stylesheet setzt eine andere Wurzelgröße, etwa html { font-size: 62.5%; } – damit wird die Basis zu 10px. Geben Sie den Wert ein, der sich für das html-Element ergibt.
Ist dieses Tool kostenlos?
Ja, es ist kostenlos. Ohne Anmeldung und ohne E-Mail. Ergebnisse direkt auf dieser Seite.
Wie erhalte ich mein Ergebnis?
Nutze das Tool auf dieser Seite. Das Ergebnis erscheint hier und wird nicht per E-Mail zugestellt.