Wie konvertiere ich px in rem für eine Basis von 16px?

Wählen Sie Pixel (px) unter Von und Root-EM (rem) unter Bis, geben Sie den Wert ein und belassen Sie Root-Schrift (px) bei 16. Das Ergebnis ist der Wert geteilt durch die Root-Schriftgröße, sodass 24px zu 1,5rem werden.

Zwischen welchen Einheiten kann konvertiert werden?

Pixel (px), rem, em, Punkt (pt), vw, vh und Prozent. Alles wird über Pixel berechnet, und alle sieben Ergebnisse werden zusammen für den von Ihnen eingegebenen Wert angezeigt.

Warum ändern sich die Ergebnisse für em, vw und %, wenn ich die Kontextfelder bearbeite?

Diese Einheiten hängen von einer Referenz ab. em und % verwenden Elternschrift (px), vw verwendet Viewport-Breite (px) und vh verwendet Viewport-Höhe (px). rem verwendet Root-Schrift (px). Legen Sie sie passend zu Ihrem Layout fest.

Kann ich ein ganzes Stylesheet von px in rem konvertieren?

Ja. Fügen Sie CSS in Eingefügtes CSS konvertieren ein, wählen Sie die Richtung, und jeder px-Wert wird bei der aktuellen Root-Größe in rem umgeschrieben, oder rem in px. Eine Zählung zeigt, wie viele Werte geändert wurden.

Wie finde ich die passende Tailwind-Klasse für eine Größe?

Sehen Sie sich Nächste Tailwind-Tokens an. Es listet die nächstgelegene Schriftgröße und das nächstgelegene Abstands-Token für Ihren Wert bei der aktuellen Root-Größe auf und kennzeichnet exakte Übereinstimmungen anders als ungefähre.

Ist es wirklich kostenlos?

Ja. Jedes Tool ist kostenlos nutzbar, ohne Konto und ohne Kreditkarte. Die Verarbeitung läuft auf Ihrem Gerät statt auf unseren Servern – genau deshalb können wir den Dienst kostenlos betreiben.

Funktioniert es auf Mobilgeräten?

Ja. Es läuft in aktuellen mobilen Browsern unter iOS und Android, ohne dass etwas installiert werden muss.

📐

Pixel zu REM Konverter – kostenlos

Konvertieren Sie zwischen px, rem, em, pt, vw, vh und % mit einer konfigurierbaren Basis-Schriftgröße. Enthält eine Referenztabelle für gängige Pixelgrößen.

Läuft in Ihrem BrowserKein Konto, keine Pop-upsKeine Anmeldung erforderlichFür immer kostenlos

Funktioniert nach dem Laden offline

Von

Nach

1rem

Kontext (beeinflusst rem/em/vw/vh/%)

Root-Schrift (px)

Elternschrift (px)

Viewport-Breite (px)

Viewport-Höhe (px)

Alle Umrechnungen für 16 px

Nächste Tailwind-Token (bei 16px Wurzel)

Gängige px-Größen → rem (Basis: 16px)

Eingefügtes CSS konvertieren

Häufige Anwendungen

PX bis REM für WebentwicklungKonvertieren Sie Pixelwerte in rem-Einheiten für skalierbare, barrierefreie CSS. Legen Sie Ihre Basisfontgröße fest und sehen Sie sofort alle äquivalenten Werte.
CSS-Einheiten für responsive GestaltungKonvertieren Sie zwischen px, vw, vh und %, um Layouts zu erstellen, die ordnungsgemäß auf verschiedene Bildschirmgrößen und -orientierungen reagieren.
Design-Spezifikationen in CSS-Einheiten konvertierenÜbersetzen Sie Figma- oder Sketch-Pixelwerte in rem/em-Einheiten für eine saubere, skalierbare CSS-Implementierung.
Tailwind CSS Unit ReferenceVerstehen Sie, wie Tailwind CSS-Größenklassen auf Pixel- und rem-Werte für eine präzise Implementierung abgebildet werden.
CSS-Einheiten für Druckstylesheets konvertierenKonvertieren Sie zwischen px, pt und rem für Druckmedienabfragen und PDF-Ausgabe-CSS.

So funktioniert es

Alle Umrechnungen laufen vollständig in Ihrem Browser mit einer selbst geschriebenen Rechen-Engine ohne Abhängigkeiten. Das Tool rechnet zwischen sieben CSS-Einheiten (px, rem, em, pt, vw, vh und %) um, indem es jede Berechnung über Pixel als gemeinsame Basis führt und einfach durch Ihre eingestellte Root-Schriftgröße, Eltern-Schriftgröße oder Viewport-Maße teilt oder damit multipliziert.

1
Kontextwerte festlegen
Vor dem Umrechnen stellen Sie die vier Zahlen ein, die relative CSS-Einheiten sinnvoll machen: Root-Schriftgröße (Standard 16px, der Browser-Standard), Schriftgröße des Elternelements (für em- und %-Umrechnungen) sowie Viewport-Breite und -Höhe (für vw und vh). Das sind dieselben Werte, die Ihr Browser beim Auflösen von CSS zur Laufzeit verwenden würde.
2
Pixel als universelle Zwischenstufe
Der Konverter ruft zuerst toPixels() auf, um Ihre Eingabe auf eine reine Pixelzahl zu normalisieren – zum Beispiel wird 1.5rem zu 1,5 × baseFontPx und 50vw zu 0,5 × vpWidth. Dann teilt fromPixels() diese Pixelzahl durch den passenden Faktor der Zieleinheit. Alle sieben Einheiten werden gleichzeitig in der Umrechnungstabelle angezeigt.
3
Nächstgelegenes Tailwind-Token
Nach der Umrechnung berechnet das Tool den rem-Wert und durchsucht zwei fest hinterlegte Tabellen – die dreizehn Schriftgrößen-Tokens von Tailwind (text-xs bis text-9xl) und seine Abstandsskala – nach dem nächstgelegenen Wert anhand des absoluten Abstands. Ein =-Zeichen bedeutet, dass der Wert genau einem Token entspricht; ≈ bedeutet die nächste Annäherung.
4
CSS-Stapelumschreibung per Regex
Das Feld zum Einfügen von CSS nimmt rohen CSS-Text entgegen und wendet eine Regex-Ersetzung an: Im Modus px→rem wird jedes px-Token gefunden und der Zahlenteil durch Wert/baseFontPx + rem ersetzt; im Modus rem→px umgekehrt. Die Anzahl der Ersetzungen wird angezeigt, damit Sie prüfen können, wie viele Werte umgeschrieben wurden.

Pixel zu REM Konverter – kostenlos

Häufige Anwendungen

So funktioniert es

Ähnliche Tools

Einheitenrechner

CSS-clamp()-Generator

CSS-Grid-Generator

Häufige Fragen