So funktioniert es
- Wählen Sie die vorhandene Einheit (pt, px, mm, em oder %) und geben Sie die Größe ein.
- Alle anderen Einheiten werden sofort angezeigt, mit einer Vorschau in dieser Größe.
- Stellen Sie für em, rem und % die Basis-Schriftgröße ein – Browser verwenden standardmäßig 16 px.
Optionen erklärt
- Punkt und Pixel
- Ein Punkt ist 1/72 Zoll, und CSS definiert einen Pixel als 1/96 Zoll, also ist 1 pt = 4/3 px und 12 pt = 16 px.
- Millimeter
- 1 pt = 25,4 ÷ 72 ≈ 0,353 mm. Das ist die physische Größe des Schriftkörpers und gilt beim Drucken.
- em, rem und Prozent
- Ein Vielfaches der Basis-Schriftgröße. Bei einer Basis von 16 px sind 1 em = 1 rem = 100 % = 16 px = 12 pt.
- Chinesische Größe (号)
- Chinesische Textverarbeitungen benennen Größen statt Punkte zu verwenden, von 初号 (42 pt) bis 八号 (5 pt). Sie können auch zu und von diesen Größen umrechnen.
Gängige Größen
| pt | px | em (Basis 16 px) |
|---|---|---|
| 9 | 12 | 0,75 |
| 10,5 | 14 | 0,875 |
| 12 | 16 | 1 |
| 14 | 18,67 | 1,1667 |
| 18 | 24 | 1,5 |
| 24 | 32 | 2 |
Web-Größen in Pixeln, Punkten und rem
Mit der Browser-Standardgröße von 16 px als Basis:
| Pixel | Punkte | rem / em | Typische Verwendung |
|---|---|---|---|
| 12 px | 9 pt | 0,75 rem | Bildunterschriften, Fußnoten |
| 14 px | 10,5 pt | 0,875 rem | Kleiner Text, Beschriftungen |
| 16 px | 12 pt | 1 rem | Fließtext |
| 18 px | 13,5 pt | 1,125 rem | Großer Fließtext, Einleitungsabsätze |
| 20 px | 15 pt | 1,25 rem | Kleine Überschriften |
| 24 px | 18 pt | 1,5 rem | Überschriften |
| 32 px | 24 pt | 2 rem | Seitentitel |
Welche Einheit sich eignet
pt (Punkte) sind für den Druck und Textverarbeitungen gedacht: 1 pt ist 1/72 Zoll, sodass ein Text mit 12 pt auf jedem Drucker dieselbe physische Größe hat.
px (CSS-Pixel) sind für Bildschirme: 1 px ist bei normalem Zoom als 1/96 Zoll definiert, wodurch 12 pt gleich 16 px sind.
rem und em sind relativ. 1 rem ist die Schriftgröße des Wurzelelements (meist 16 px); 1 em ist die Schriftgröße des übergeordneten Elements. Wer Text mit rem festlegt, ermöglicht Menschen, die in ihrem Browser eine größere Standardschrift eingestellt haben, überall größeren Text.
Millimeter helfen beim Abgleich mit einem gedruckten Muster: Messen Sie die Höhe eines Großbuchstabens, und die Schriftgröße beträgt je nach Schrift ungefähr das 1,4-Fache davon.
Häufig gestellte Fragen
Wie viele Pixel sind 12 pt?
16 px. Multiplizieren Sie Punkt mit 4/3, um CSS-Pixel zu erhalten, oder Pixel mit 0,75, um Punkt zu erhalten.
Was ist der Unterschied zwischen em und rem?
rem bezieht sich auf die Schriftgröße der Wurzel (html); em bezieht sich auf die Schriftgröße des übergeordneten Elements. Ist nirgends eine Schriftgröße festgelegt, sind beide 16 px.
Warum stimmt am Bildschirm gemessener Text nicht mit der Umrechnung überein?
Ein CSS-Pixel ist eine logische Einheit, definiert bei 96 DPI. Die physische Größe auf dem Bildschirm hängt von der Pixeldichte des Displays und dem System-Zoom ab. Punkt und Millimeter sind nur im Druck exakt.
Datenschutz
Dieses Tool läuft vollständig in Ihrem Browser. Ihre Dateien und Texte werden auf Ihrem Gerät verarbeitet und nie auf unsere Server hochgeladen.