CSS-Einheiten-Rechner
Rechnen Sie CSS-Einheiten wie px, rem, em, %, vw und vh mit anpassbarer Basisgröße und Viewport-Breite um.
Tool ausführen
Dieser CSS-Einheiten-Rechner rechnet numerische Werte zwischen typischen Einheiten für Webdesign und Stylesheets um. Unterstützt werden absolute Maße wie Pixel (px), Punkte (pt), Zentimeter (cm), Millimeter (mm) und Zoll (in) sowie relative Einheiten wie rem, em, Prozent (%), Viewport-Breite (vw) und Viewport-Höhe (vh). Die Umrechnung erfolgt intern über Pixelwerte als Referenzgröße. Für relative Angaben wie rem oder em legen Sie die Basis-Schriftgröße in Pixeln fest, die standardmäßig auf 16 gesetzt ist. Bei Viewport-Einheiten definieren Sie die Abmessungen des Anzeigebereichs für Breite und Höhe. Das Tool berechnet das Ergebnis sowie den Zwischenwert in Pixeln und rundet beide Ausgaben auf vier Nachkommastellen. Wenn Sie keinen Ausgangswert eingeben, verwendet das System den Standardwert 16 px und konvertiert diesen nach rem. Ist die Basis-Schriftgröße oder die relevante Viewport-Dimension auf null gesetzt, liefert die Umrechnung für die jeweiligen relativen Einheiten den Wert null. Nicht erkannte Einheitenbezeichnungen werden direkt als unveränderte Pixelwerte übernommen.
Anleitung
- Geben Sie den numerischen Ausgangswert in das vorgesehene Zahlenfeld ein.
- Wählen Sie die Ausgangseinheit aus dem ersten Auswahlmenü aus.
- Bestimmen Sie im zweiten Auswahlmenü die gewünschte Zieleinheit.
- Passen Sie bei Bedarf die Basis-Schriftgröße sowie die Viewport-Breite und Viewport-Höhe an.
- Starten Sie die Berechnung, um den umgerechneten Wert und den Pixel-Zwischenwert abzulesen.
Beispiele
- Umrechnung von 24 px in rem bei einer Basis-Schriftgröße von 16 px ergibt 1.5 rem.
- Umrechnung von 2 rem in Pixel bei einer Basis-Schriftgröße von 16 px liefert 32 px.
- Umrechnung von 50 vw in Pixel bei einer Viewport-Breite von 1920 px ergibt 960 px.
FAQ
Welche Basisgröße wird für rem und em verwendet?
Standardmäßig nutzt das Werkzeug eine Basisgröße von 16 Pixeln. Sie können diesen Wert im Feld für die Basis-Schriftgröße an Ihr Web-Layout anpassen.
Wie rechnet das Tool Viewport-Einheiten wie vw und vh um?
Viewport-Werte werden anhand der angegebenen Viewport-Breite (Standard: 1920 px) und Viewport-Höhe (Standard: 1080 px) anteilig in Pixel und anschließend in die Zieleinheit umgerechnet.
Was passiert, wenn die Basisgröße oder Viewport-Dimension auf 0 gesetzt wird?
Wenn die Basis-Schriftgröße oder eine Viewport-Dimension auf 0 gesetzt ist, kann das Tool für relative Einheiten keinen sinnvollen Wert berechnen und gibt stattdessen 0 aus.
Auf wie viele Stellen wird das Ergebnis gerundet?
Sowohl der finale Zielwert als auch der Zwischenwert in Pixeln werden auf vier Nachkommastellen gerundet.