Zum Inhalt springen

CSS-Einheiten-Konverter

Konvertieren Sie CSS-Einheiten lokal eins zu eins zwischen px, rem, em, %, vw, vh, vmin, vmax, pt, pc, in, cm, mm, q, ex und ch. Verwenden Sie dazu Einstellungen für die Stammschriftgröße, die EM-Referenzschriftgröße, das Ansichtsfenster und die Prozentreferenz. Absolute CSS-Einheiten verwenden das feste Verhältnis 1in = 96px.

px
Zum Wechseln der Einheit tippen

Längeneinheiten

Typografie

Viewport

Prozentwerte

rem
Zum Wechseln der Einheit tippen

Längeneinheiten

Typografie

Viewport

Prozentwerte

CSS-Einheiten-Konverter

Schnellstart

1
Wert eingeben und Von-Einheit wählen
2
Nach-Einheit wählen oder mit Tauschen umkehren
3
Root/EM-Referenz/%/Viewport nach Bedarf festlegen; für EM die von der Eigenschaft tatsächlich verwendete Schriftgröße nutzen.
4
Konvertiertes Ergebnis kopieren
5
Viewport-Voreinstellungen für vw/vh-Prüfungen wechseln

Häufige Anwendungsfälle

Einsatz

Responsive Layouts, Übergabe Design→Dev, Dichte/Print‑Bezug, einheitliche Konventionen

Nutzungstipps

Basis setzen: 16px‑Root ist gängig und erleichtert rem ↔ px Kopfrechnen
Text in rem: ermöglicht globale Skalierung & A11y; em für komponentenlokale Skalierung
Verwenden Sie Ansichtsfenstereinheiten für Layoutschätzungen: Kombinieren Sie sie mit Haltepunkten und Min/Max-Einschränkungen, um Extreme zu vermeiden
Dezimalstellen & Rundung: sinnvolle Präzision wahren

Parameter & Kontext

REM-Basis (Root-Schriftgröße): bestimmt rem ↔ px. 16px ist üblich (1rem≈16px). Bei abweichender Design-Basis anpassen.
EM-Referenzschriftgröße: Geben Sie die tatsächlich von der Eigenschaft verwendete Schriftgröße ein. em verwendet in der Regel die berechnete Schriftgröße des aktuellen Elements; für font-size und ähnliche schriftbezogene Eigenschaften verwenden Sie die Schriftgröße des übergeordneten Elements. Diese Referenz dient außerdem zur Annäherung von ex/ch sowie für %, wenn „Schriftgröße“ ausgewählt ist.
% Bezug: je nach Kontext Schriftgröße / Breite / Höhe wählen (Layout vs Typografie).
Breakpoint‑Voreinstellungen setzen auch die Viewport‑Größe für die Schätzung (keine Laufzeit‑Media‑Query).
Viewport‑Größe für vw/vh/vmin/vmax und % (Breite/Höhe). Geräte können durch Adressleisten/Safe Areas/Scrollbars variieren.
Tipps: 1) 16px ist ein gängiger Wert für die Stamm- und EM-Referenz, verwenden Sie jedoch die tatsächlich von der Eigenschaft verwendete Schriftgröße; 2) überprüfen Sie Layout-Prozentwerte, indem Sie zwischen Breakpoints wechseln; 3) diese Steuerelemente unterstützen Schätzungen während des Entwurfs und ersetzen nicht die abschließende DOM-/CSS-Berechnung des Browsers. Absolute Einheiten verwenden immer 1in = 96px.

Einschränkungen und Kompatibilität

% Referenz hängt von der CSS-Eigenschaft, dem enthaltenden Block und dem Layoutmodus ab; Dieses Tool verwendet zur Schätzung die ausgewählte Referenz für Schriftgröße/Ansichtsfensterbreite/Ansichtsfensterhöhe, keine Live-Messung des übergeordneten Elements/Containers
ex/ch sind hier Näherungswerte auf Grundlage der EM-Referenzschriftgröße. Die Ergebnisse stellen keine Prüfung der Schriftmetriken dar und unterscheiden sich je nach Schriftart und Browser.
Klassische vw/vh/vmin/vmax variieren mit Bildlaufleisten/Adressleisten/sicheren Bereichen; Dieses Tool berechnet keine DVH/SVH/LVH-, VI/VB-, Safe-Area- oder Container-Abfrageeinheiten
Umrechnungen absoluter CSS-Einheiten verwenden das feste Verhältnis 1in = 96px. Um physische Bildschirmpixel mit einer Druckgröße in Beziehung zu setzen, ist ein separater Geräte-/Druck-Workflow erforderlich, den dieses Tool nicht bereitstellt.

Datenschutz & Sicherheit

Die Verarbeitung erfolgt in Ihrem Browser. Eingabewert, Ausgangs-/Zieleinheiten, zwischengespeicherte Werte je Einheit, Stammschriftgröße, EM-Referenzschriftgröße, Ansichtsfenster, Prozentreferenz und Breakpoint-Auswahl können in der aktuellen Browsersitzung oder im Browserspeicher verbleiben. Wenn Sie einen Arbeitsbereich speichern oder die WebDAV-Synchronisierung aktivieren, können diese Werte gemäß Ihren Synchronisierungseinstellungen gespeichert werden. Umrechnungsergebnisse werden anhand des aktuellen Werts, der Einheiten und der Kontexteinstellungen neu berechnet und nicht als separate Ergebnisse gespeichert. Diese Seite ruft keine URLs ab und sendet keine Werte zur serverseitigen Umrechnung. Löschen Sie auf gemeinsam genutzten Geräten bei Bedarf Werte, Einstellungen und Websitedaten.

Häufige Fragen

4

Fahren Sie mit diesen verwandten Tools im nächsten Schritt fort.

Die gesamte Verarbeitung der Tools findet lokal in Ihrem Browser statt.