Zum Inhalt springen

PX in PT umrechnen

px → pt
72

pt = px × 72 ÷ DPI

Ergebnisse werden auf höchstens sechs Nachkommastellen gerundet.

Von Bogdan Sandu (EN) · Veröffentlicht am · Zuletzt aktualisiert am

Dieser PX-zu-PT-Konverter ist ein schlankes Browser-Tool, das Pixel und Punkte für Bildschirm- und Druckanwendungen sofort ineinander umrechnet.

Schlüsselfunktionen:

  • Bidirektionale Konvertierung - Geben Sie in einem Feld und die anderen Aktualisierungen in Echtzeit
  • DPI-Modus umschalten - wechseln Sie zwischen Bildschirm (96 dpi) und Druck (72 dpi) entsprechend Ihrem Kontext
  • Live-Formel-Anzeige - zeigt die exakte Multiplikation, so dass Sie die Mathematik verstehen, nicht nur das Ergebnis
  • Gemeinsame Wertereferenz - 12 anklickbare Chips für häufig verwendete Größen wie 8px, 16px, 24px, 64px
  • Kopieren Buttons - greifen Sie einen Wert in die Zwischenablage mit einem Klick
  • Swap - die Richtung der Konvertierung umkehren, ohne neu einzugeben

Nützlich für Designer, die zwischen Figma, CSS und Druckdokumenten wechseln. Die Formelleiste macht es auch zu einem Lernwerkzeug und nicht nur zu einem Taschenrechner.


So verwenden Sie diesen PX zu PT Konverter

Wählen Sie oben im Konverter Bildschirm (96 dpi) oder Druck (72 dpi) und geben Sie dann einen Wert in jedes Feld ein. Das andere Feld wird während der Eingabe aktualisiert, und die Bearbeitungsleiste zeigt die genaue Multiplikation hinter dem Ergebnis an.

Die 12 Chips unter den Feldern füllen mit einem Klick gängige Größen aus. Verwenden Sie die Swap-Taste, um die Richtung zu wechseln, und die Kopier-Tasten, um einen Wert zu erfassen.

Der DPI-Schalter ist wichtig, da Pixel und Punkte nur bei 72 dpi aufeinander abgestimmt sind. Bei dem 96 dpi Standard, den die meisten Bildschirme und jeder Browser verwenden, entspricht 1px 0,75pt. Deshalb bricht die Annahme von 1px = 1pt in der Produktion.


Die PX zu PT Formel

Die allgemeine Formel hängt von der Pixeldichte der Ausgabeumgebung ab:

pt = px × 72 ÷ PPI

PPI ist die Variable, die die meisten Menschen vergessen. Beim 96 PPI-Webstandard ergibt 72 ÷ 96 0,75, was die Abkürzung darstellt, auf die sich jeder Konverter und jedes CSS-Druck-Stylesheet verlässt:

pt = px × 0.75

  • 16px → 12pt
  • 24px → 18pt
  • 32px → 24pt
  • 10px → 7.5pt

Das CSS Values and Units Module (EN) des W3C legt dieses Verhältnis direkt fest: Ein CSS-Pixel entspricht 1/96 eines Zolls, und ein Punkt entspricht 1/72 eines Zolls. Diese 1/96-Zahl ist die gleiche, die verwendet wird, um zu berechnen, wie viele Pixel in einen Zoll passen (EN) auf einem Standard-Display.

Bei 72 PPI sind Pixel und Punkte gleich: 1px = 1pt. Das ist, wo der "sie sind die gleichen" Mythos kommt. Es hält nur bei 72 PPI, was auf modernen Bildschirmen selten ist.

Rundungen sind hier wichtig. Werte, die nicht gleichmäßig geteilt werden, ergeben lange Dezimalstellen, und die meisten Designtools runden auf eine oder zwei Dezimalstellen auf, anstatt die ganze Zahl anzuzeigen. Eine Designer-Einstellung von 10px erhält genau 7,5pt, aber 15px landet auf 11,25pt.

PT zu PX: Die umgekehrte Formel

Von Punkten zurück zu Pixeln bei 96 PPI, dividieren Sie durch 0,75 oder multiplizieren Sie mit 1,333:

px = pt ÷ 0.75

  • 12pt → 16px
  • 9pt → 12px
  • 18pt → 24px
  • 11pt (Word-Standard) → 14,67px

Das Verhältnis ist fest und symmetrisch, da beide Einheiten auf denselben Zoll zurückgehen. Geben Sie einen Wert in das Feld „Punkte“ des Konverters oben ein, um ihn auszuführen.


PX nach PT Diagramm

Referenzwerte bei 96 PPI:

PXPT
8px6pt
10px7,5pt
12px9pt
14px10,5pt
16px12pt
18px13,5pt
24px18pt
32px24pt
48px36pt
64px48pt
72px54pt
96px72pt

Der Standard-Textkörper hat eine Größe von 16px / 12pt. Diese Paarung ist wichtig, weil 16px die Standard-Schriftgröße ist, die jeder gängige Browser unter dem CSS-Schlüsselwort medium darstellt. Überschriften und Anzeigegrößen skalieren von dort aus vorhersagbar nach oben.

Benötigen Sie den Pixelwert stattdessen in einer anderen physikalischen Einheit? Ein dediziertes Pixel zu Zoll Konvertierungstool behandelt das allein, und ein ähnlicher Pixel zu Zentimeter Konverter deckt die metrische Seite ab.


Was ist ein PX zu PT Konverter?

Ein PX zu PT Converter ist ein Rechner, der Pixelwerte in Punktwerte für Typografie, Drucklayouts und Design-Software umwandelt.

Es existiert, weil CSS (EN) Text auf dem Bildschirm in Pixeln darstellt, während Druck- und Seitenlayout-Tools Text und Abstand in Punkten messen. Ohne eine feste Konvertierung kann eine Schriftart, die auf dem Bildschirm richtig aussieht, in der völlig falschen Größe gedruckt werden.

Designer greifen in einigen wiederkehrenden Situationen zu einem PX zu PT Konverter:

  • Exportieren eines Web-Mockups in eine druckfertige PDF-Datei
  • Festlegen der Schriftgröße für ein Dokument, das gedruckt und nicht auf dem Bildschirm angezeigt werden soll
  • Übereinstimmung der Typografiespezifikationen zwischen einem Web- und einem Druckteam
  • Übersetzen von CSS-Schriftgrößen in Punktwerte für einen Styleguide

Das Tool unterscheidet sich von einem allgemeinen Einheitenumrechner dadurch, dass es einen typografischen Kontext und keinen reinen physikalischen Messkontext voraussetzt. Die Eingabe eines Pixelwerts für Zoll oder Zentimeter ergibt eine technisch korrekte, aber praktisch nutzlose Antwort, da diese Einheiten nicht über die Drucktradition verfügen, die Punkte haben.

Das PostScript Language Reference Manual von Adobe fixierte den Punkt 1985 auf genau 1/72 Zoll und ersetzte damit den etwas kleineren 1/72,27-Zoll-Druckerpunkt, der seit 1886 die Schrift bestimmt hatte. Diese einzige Entscheidung ist der Grund, warum eine moderne px-zu-pt-Konvertierung eine konsistente, vorhersagbare Zahl erzeugt, anstatt der Bruchpunktgrößen, um die ältere Druckereien herumarbeiten mussten.

PX vs. PT: Was diese Einheiten auszeichnet

Pixel und Punkte stammen aus zwei unterschiedlichen Messtraditionen, und das ist der einzige Grund, warum ein Konverter erforderlich ist.

Ein Pixel ist an den Bildschirm gebunden, ein Punkt ist an die gedruckte Seite gebunden, und keiner passt sich automatisch an den anderen an.

Was ist ein Pixel?

Pixel ist die Abkürzung für Bildelement, die kleinste Einheit, die ein Bildschirm darstellen kann. Pixel sind bildschirmabhängig: Eine 16px Schrift auf einem 96 PPI Monitor sieht anders aus als 16px auf einem 72 PPI Display.

  • Ein CSS-Pixel ist eine feste Referenzeinheit, nicht dasselbe wie ein physischer Punkt auf einem Monitor
  • Seine gerenderte Größe ändert sich je nach Bildschirm, auf dem es angezeigt wird
  • Displays mit hoher Dichte packen mehr physische Punkte in den Raum eines CSS-Pixels

Apples Retina-Displays sind das deutlichste Beispiel für diesen Pixeldichte (EN)-Effekt, der die physische Punktzahl verdoppelt, so dass ein CSS-Pixel zwei Gerätepixel in jede Richtung überspannt.

Was ist ein Point (PT)?

Point ist eine typografische Einheit, die den Computerbildschirmen um Jahrhunderte vorausgeht und im Druck und im Satz verwendet wird.

Ein Punkt entspricht 1/72 eines Zolls, einer festen physikalischen Maßeinheit, die sich je nach Gerät oder Display nicht ändert.

Zwölf Punkte bilden eine Pica, eine weitere typografische Einheit, die in Seitenlayout-Software weitaus häufiger vorkommt als im Web.

Da Punkte an einen physischen Zoll verankert sind, wird derselbe Punktwert in derselben Größe gedruckt, unabhängig davon, mit welchem Drucker oder welcher Software die Datei erstellt wurde.

Warum DPI die Konvertierung von PX nach PT ändert

DPI entscheidet, wie viele physische Punkte einen Zoll darstellen, und das Verhältnis von 0,75 gilt nur für den in CSS integrierten 96-DPI-Standard.

Ändern Sie die DPI (EN), und die gleiche Pixelanzahl entspricht nicht mehr der gleichen physischen Größe.

Kommerzielle Drucker benötigen im Allgemeinen 300 DPI (EN) für eine scharfe Ausgabe, verglichen mit den 72 bis 96 DPI, die die meisten Bildschirme rendern. Vistaprints Upload-Richtlinien (EN) legen beispielsweise 300 DPI bei der endgültigen Druckgröße als Minimum fest.

DPI StandardTypische VerwendungszweckeAuswirkung auf PX zu PT
72 DPIAlte Bildschirme und frühe Mac-Displays1px = 1pt
96 DPIModerne Webbrowser, CSS-Standard1px = 0.75pt, das Standardverhältnis
300 DPIProfessionelle Druckproduktion1px = 0.24pt; Verhältnis muss neu berechnet werden

Eine Pixel-zu-Punkt-Konvertierung, die für die Bildschirmnutzung entwickelt wurde, sieht in einem Browser korrekt aus, wird jedoch unterdimensioniert, wenn sie einen Drucklauf mit 300 DPI erreicht.

Wann PX vs. PT in der Designarbeit verwenden

Bildschirmarbeit erfordert px, Druckarbeit erfordert pt, und die Mischung der beiden in einem Workflow verursacht Kopfschmerzen bei der Größenbestimmung.

Pixel (px):

  • Passt sich Gerätebildschirmen und Ansichtsfenstern exakt an
  • Ignoriert die physische Größe, sodass ein Layout, das auf dem Bildschirm richtig aussieht, viel kleiner oder größer als erwartet gedruckt werden kann

Punkte (pt):

  • Hält eine feste physische Größe auf Papier, unabhängig davon, welches Gerät die Datei geöffnet hat
  • Wird nicht sauber auf pixelbasierte Bildschirmraster abgebildet, sodass Bildschirmvorschauen etwas verzerrt aussehen können

Viele Designteams vereinheitlichen Abstände mit einem 8-Punkt-Rastersystem (EN). Dabei bleiben alle Maße in px angegeben und lassen sich nach der Umrechnung für den Druck weiterhin sauber skalieren.

Das funktioniert, weil Vielfache von 8px in runde Punktwerte ohne verbleibende Dezimalstellen umgewandelt werden.

Screen-first-Teams, die für mehrere Geräte erstellen, stützen sich tendenziell auf responsive Design (EN)-Praktiken, bei denen px die meisten Messungen verankert, auch wenn sich Layouts an verschiedene Bildschirme anpassen.

PX vs PT vs EM vs REM: Die Wahl der richtigen CSS-Einheit

Pt erscheint selten im alltäglichen CSS, da Browser standardmäßig px, em und rem für die Bildschirmgröße verwenden.

Seine Hauptrolle in CSS ist das Drucken von Stylesheets, wo eine feste physikalische Einheit wichtiger ist als eine skalierbare.

Die WCAG 1.4.4 Richtlinie (EN) des W3C schreibt vor, dass die Textgröße bis zu 200% ohne Verlust von Inhalt oder Funktion verändert werden kann. Das ist eine Bar, die feste Einheiten wie px und pt nur schwer von alleine lösen können.

EinheitTypWaagen mitTypische Verwendungszwecke
pxAbsoluteNichts, feste GrößeBildschirmlayouts, Rahmen
ptAbsoluteNichts, feste GrößeStylesheets drucken, Satz
emRelativSchriftgröße des übergeordneten ElementsDimensionierung auf Komponentenebene
remRelativSchriftgröße des Root-ElementsGlobale Schrift- und Abstandsskala

Der Unterschied zwischen em und rem (EN) irritiert viele Neulinge, da beide relativ zur Schriftgröße skalieren, sich aber auf unterschiedliche Elemente beziehen.

Richtlinien für Web-Zugänglichkeit (EN) bevorzugen im Allgemeinen rem und em gegenüber px oder pt für Text, da relative Einheiten die Browsereinstellungen eines Benutzers respektieren.

Pt behält seinen Platz für druckspezifische Stylesheets, bleibt aber überall sonst in CSS ein kleiner Spieler.

Welche Software verwendet PT vs PX standardmäßig

Browser und bildschirmbasierte Tools verwenden standardmäßig px, während Druck- und Textverarbeitungssoftware standardmäßig pt verwenden.

Die Aufteilung stimmt mit der Ausgabe jedes Programms überein.

SoftwareStandardeinheitGebaut für
Webbrowser / CSSpxBildschirmdarstellung
Adobe InDesignPicas und PunkteDrucklayout
Microsoft WordPointsDokumente, Druck und Verpackung
FigmaNur pxBildschirm- und UI-Design

InDesign wird mit Picas als Standardlinealeinheit für neue Druckdokumente geliefert, obwohl die Schriftgröße selbst immer in Punkten festgelegt ist, wie in der Dokumentation zu Adobes Maßeinheiten (EN) beschrieben.

Word behandelt dies noch direkter: seine Font. Size-Eigenschaft (EN) gibt die Schriftgröße in Punkten zurück und legt diese fest, und ein leeres Dokument ist standardmäßig auf 11-Punkt-Calibri eingestellt.

Figma sitzt ganz am anderen Ende. Figmas eigene Dokumentation (EN) zeigt jedes Maßfeld in Pixeln an, ohne dass eine Punktoption in die Oberfläche integriert ist.

Diese Lücke verursacht echte Reibung, wenn eine Schriftspezifikation, die in Punkten für den Druck geschrieben wurde, an ein Team übergeben wird, das in einem reinen Pixel-Tool arbeitet. Jemand muss es in eine Richtung und zurück umwandeln.

Rendering-Unterschiede verschlimmern das Problem zwischen Programmen, was ein Teil des Grundes ist, warum cross-browser-kompatibilität (EN) Tests für jedes Layout wichtig sind, das beide Einheitstypen kombiniert.

Wie man PX in PT in CSS konvertiert

Die Konvertierung innerhalb von CSS selbst dauert vier Schritte.

  1. Identifizieren Sie den Pixelwert, von dem aus Sie arbeiten
  2. Multipliziere diesen Wert mit 0,75
  3. Schreiben Sie das Ergebnis als pt-Wert in die Eigenschaft, die es benötigt, z. B. font-size
  4. Zeigen Sie eine Vorschau der Seite an und bestätigen Sie, dass die gerenderte Größe der erwarteten entspricht.

Eine 20px Überschrift wird nach der Konvertierung zu font-size: 15pt;.

Die meisten Teams tun dies nur, wenn sie ein eigenes Druck-Stylesheet schreiben, da sich pt in einem normalen Bildschirm-Stylesheet nicht so verhält wie px.

Indem die pt-basierten Regeln in eine druckspezifische Media-Abfrage (EN) eingebettet werden, wird verhindert, dass sie das Aussehen der Seite auf einem normalen Bildschirm beeinflussen.

Wenn Sie diesen Schritt überspringen, können Besucher, die normalerweise surfen, Schriftarten sehen, die für Papier und nicht für Monitore geeignet sind.

So konvertieren Sie PX in PT in Design- und Drucksoftware

Konvertieren in Adobe Illustrator und InDesign

  1. Öffnen Sie die Einstellungen und stellen Sie das Lineal oder die Texteinheit auf Punkte ein
  2. Geben Sie die pixelbasierte Messung multipliziert mit 0,75 direkt in das Feld Größe ein
  3. Bestätigen Sie den Wert im Zeichen- oder Absatzbedienfeld, in dem die Schriftgröße standardmäßig in Punkten angezeigt wird.

Beide Anwendungen behalten Schriftmaße in Punkten bei, unabhängig davon, auf welche Einheiten die Lineale eingestellt sind, da Punkte die native Typografieeinheit in den Druckwerkzeugen von Adobe sind.

Konvertieren in Microsoft Word

  • Schriftgröße-Feld: bereits in Punkten gemessen, so dass ein konvertierter pt-Wert direkt in das Größenfeld geht
  • Abstand und Ränder: Word verwendet standardmäßig Zoll für das Seitenlayout, was eine separate Konvertierung erfordert, wenn Pixelwerte betroffen sind

Es gibt nirgendwo in der Benutzeroberfläche von Word eine direkte px-Eingabe, daher muss jede pixelbasierte Spezifikation konvertiert werden, bevor sie verwendet werden kann.

Konvertieren einer Bildschirmdesign-Datei für den Druck

Wenn Sie ein Bildschirmmodell in etwas Druckfähiges exportieren, müssen Sie mehr als nur die Schriftgröße ändern.

Die gesamte Datei muss in der Regel auf eine viel höhere Bildschirmauflösung (EN) umgestellt werden, bevor pixelbasierte Messungen in etwas übersetzt werden können, das auf Papier verwendet werden kann.

Bei diesem Export ändern sich drei Dinge gleichzeitig:

  • Schriftgrößen werden von px in pt mit dem Verhältnis 0,75 umgewandelt
  • Die Bildauflösung verschiebt sich von der Bildschirmdichte auf 300 DPI
  • Abstände und Ränder werden häufig in Zoll oder Millimetern neu erstellt, anstatt direkt skaliert zu werden

Das Überspringen eines dieser drei Schritte ist der häufigste Grund, warum ein für den Bildschirm perfektes Design vom Drucker falsch aussieht.

Wenn die PX-zu-PT-Konvertierung nicht anwendbar ist

Das 0.75-Verhältnis hält nur bei genau 96 DPI.

Bewegen Sie sich außerhalb dieser spezifischen Bedingung, und die Standardformel px zu pt gibt keine physikalisch genaue Antwort mehr.

Wo die Standardformel aufbricht:

  • Jeder Bildschirm oder jedes Dokument, das auf einen anderen DPI-Wert als 96 eingestellt ist, da das Verhältnis auf diese eine Grundlinie festgelegt war
  • Retina- und mobile Displays mit hoher Dichte, bei denen ein CSS-Pixel zwei, drei oder mehr physischen Gerätepixeln zugeordnet ist
  • Dateien, die für eine 300 DPI-Druckausgabe konvertiert wurden, ohne das Verhältnis für diese Auflösung neu zu berechnen
  • Dokumente, die Didot-Punkte anstelle von Standardpunkten verwenden, da die beiden Punktsysteme nicht die gleiche physikalische Größe haben

Die W3C-eigene Referenzpixel-Definition (EN) erkennt die Lücke direkt an: Ein CSS-Pixel ist bei normalem Leseabstand etwa 0,26 mm. Diese Zahl geht von einer spezifischen Betrachtungseinstellung aus und nicht von einem tatsächlich gemessenen Bildschirmpunkt.

Es handelt sich um eine bewusste Annäherung und nicht um eine physische Garantie, weshalb die gleiche Pixelanzahl auf verschiedenen Bildschirmen wie unterschiedliche physische Größen aussieht.

Ein paar Fehler tauchen deshalb ständig auf:

  • Anwenden des Verhältnisses 0,75 auf eine Druckdatei, die tatsächlich auf 300 DPI eingestellt ist, wodurch der Text viel kleiner als beabsichtigt wird
  • Eine Pica und einen Punkt als austauschbar behandeln, obwohl eine Pica eigentlich zwölf Punkte ist
  • Angenommen, ein konvertierter pt-Wert sieht in jedem Browser oder jeder Rendering-Engine jedes Betriebssystems identisch aus

Wenn eine dieser Bedingungen zutrifft, ist die Korrektur keine andere Formel. Es wird auf die Einheit umgeschaltet, in der die Zielsoftware tatsächlich misst, unabhängig davon, ob es sich um DPI-fähige Druckeinstellungen oder softwarenative Punktfelder handelt.

Statische Einheiten wie px und pt erschweren auch die Dinge für Leser, die die Textgröße in ihrem Browser ändern. Das ist ein weiterer Grund, warum die Leitlinien für zugängliche Typografie (EN) von festen Einheiten für den Bildschirminhalt vollständig abrücken.

Häufige Fragen: PX in PT umrechnen

Was ist eine Pica und wie bezieht sie sich auf Punkte?

Ein Pica ist eine typografische Einheit, die zwölf Punkten entspricht und hauptsächlich zum Messen von Spaltenbreiten und Zeilenlängen im Drucklayout verwendet wird.

Punkte messen die Schriftgröße, Picas messen größere Blöcke. Das Lineal von Adobe InDesign wird sowohl als p- als auch als pt-Notation angezeigt.

Beeinflussen Browser-Zoom oder Bildschirmdichte die Konvertierung?

Der Browser-Zoom skaliert die gesamte Seite, einschließlich der Pixel, sodass das Verhältnis von 0,75 bei jeder Zoomstufe erhalten bleibt.

Bildschirmdichte funktioniert anders: Displays mit hoher Dichte packen mehr physische Punkte in jedes CSS-Pixel, wodurch das Aussehen einer konvertierten Punktgröße verzerrt wird, ohne die Mathematik zu ändern.

Kann man PT mit der gleichen Formel umgekehrt wieder in PX umwandeln?

- Ja. - Ja. Teilen Sie den Punktwert durch 0,75 oder multiplizieren Sie ihn mit 1,333, um die Pixel zurückzubekommen: 12pt wird 16px, 18pt wird 24px. Gearbeitete Beispiele sind im PT zu PX Abschnitt oben.

Was ist der Unterschied zwischen einem Standardpunkt und einem Didotpunkt?

Ein Standardpunkt, der in CSS und der meisten Software verwendet wird, entspricht 1/72 Zoll oder etwa 0,353 mm.

Ein Didot-Punkt, üblich im kontinentaleuropäischen Schriftsatz, misst ungefähr 0,376 mm, basierend auf dem alten französischen königlichen Zoll anstelle des modernen Zolls.

Müssen relative Einheiten wie REM und EM überhaupt in PT umgerechnet werden?

Nein. Rem (EN) und em werden relativ zur Schriftgröße skaliert, während pt eine feste physikalische Einheit ohne Beziehung zu einem übergeordneten oder Stammelement ist.

Die Umrechnung zwischen ihnen widerlegt den Zweck der Verwendung einer relativen Einheit an erster Stelle.

Wie bestätigen Sie ein PX zu PT Konverter Ergebnis vor der Verwendung?

Das Ergebnis eines PX-zu-PT-Konverters wird bestätigt, indem drei Dinge der Reihe nach überprüft werden: die DPI-Annahme hinter der Zahl, die Einheit, die die Zielsoftware erwartet, und wie der Wert nach der Platzierung tatsächlich gerendert wird.

Das Überspringen der Bestellung kostet mehr Zeit als das Befolgen. Eine falsche DPI-Annahme taucht erst bei der dritten Prüfung auf, nachdem bereits in die ersten beiden Anstrengungen investiert wurde.

  • Bestätigen Sie die DPI, für die die Datei erstellt wurde
  • Passen Sie das Gerät an die Zielsoftware an
  • Rendern oder Drucken eines Testbeispiels vor der Fertigstellung

Diese Abfolge fügt jeder Übergabe zwischen einem Team für Bildschirmgestaltung und einem Druckteam einen manuellen Schritt hinzu. Dafür muss das Dokument nach der Übergabe nicht mehr in der Größe angepasst werden.

Sobald die Schriftgrößen ausgecheckt sind, verbirgt sich die nächste Inkonsistenz bei Abstand und Layoutbreite. Hier wird der Vergleich von px gegen rem (EN) zur nützlicheren Konvertierungsfrage.