Zum Inhalt springen

DPI (Dots Per Inch)

Männliche Person, frontal, schaut in die Kamera; trägt kariertes Hemd über dunkelfarbigem T‑Shirt; heller Innenraum mit unscharfem Monitor oder Poster links und Fenster rechts.

von Richard Albrecht am 11.11.2026

DPI steht für dots per inch, Punkte pro Zoll. Der Duden nennt es eine Maßeinheit für die Bildauflösung. Ein Zoll sind 2,54 Zentimeter; bei 300 dpi liegen auf dieser Strecke 300 Druckpunkte nebeneinander.

DPI

Eine Maßeinheit für die Auflösung, die angibt, wie viele Punkte auf einen Zoll kommen, vor allem im Druck.
Beispiel: „Für den Flyer brauchen die Fotos 300 dpi in Druckgröße, sonst wirken sie unscharf.“

Auch: dpi, Punkte pro Zoll.

Abgrenzung zu PPI: Es zählt die Pixel einer Bilddatei oder eines Bildschirms, DPI die Druckpunkte.

DPI im Druck

Für Drucksachen bis etwa A3 gelten 300 dpi in Endgröße als Richtwert, so die Datenblätter von Druckereien wie FLYERALARM und druck.at. Großformate ab A2 kommen mit 100 bis 150 dpi aus, weil man sie aus größerem Abstand betrachtet. Entscheidend ist die Zahl der Pixel im Verhältnis zur Druckgröße, nicht der DPI-Wert in den Dateieigenschaften.

DPI und PPI

Im Alltag werden DPI und PPI oft gleichgesetzt. Genau genommen beschreibt PPI, wie viele Pixel eine Datei oder ein Bildschirm pro Zoll hat, DPI, wie viele Punkte ein Drucker setzt. Für Bildschirme ist die Pixeldichte der passende Begriff; ein Foto für eine Website braucht genug Pixel, ein DPI-Wert ist dort bedeutungslos.

Zwei gleich große Quadrate, jedes ein Inch breit und mit einer Maßlinie 1 Inch gleich 2,54 Zentimeter beschriftet. In beiden derselbe blaue Kreis aus Punkten: links mit 12 Punkten pro Inch grob und treppig, rechts mit 48 Punkten pro Inch fein und fast glatt.
Gleiche Fläche, mehr Punkte: Je höher die dpi, desto feiner die Kante. Bei voller Breite ist jedes Quadrat einen CSS-Zoll groß.

dpi in CSS

CSS kennt dpi als Einheit für Auflösungen. Laut CSS Values 4 entspricht ein Zoll fest 96 CSS-Pixeln, deshalb ist 1dppx gleich 96dpi. Die Media Query resolution fragt damit hochauflösende Bildschirme ab; sie ist seit März 2025 weit verfügbar.

@media (min-resolution: 2dppx) {
  .logo { background-image: url("logo@2x.png"); }
}

Siehe auch:

Pixelgrafik

Ein Bild, das aus einem Raster einzelner Bildpunkte besteht, von denen jeder eine Farbe speichert.

#Gestaltungsgrundlagen

Pixel Density

Physikalische Dichte der Bildpunkte auf einem Bildschirm, angegeben in Pixeln pro Zoll und mit ppi abgekürzt.

#Webdesign-Grundlagen

Retina Display

Apples Bezeichnung für Bildschirme, deren Bildpunkte aus dem üblichen Betrachtungsabstand nicht mehr einzeln erkennbar sind.

#Webdesign-Grundlagen

Responsive Bilder

Technik, bei der ein Bild in mehreren Größen bereitliegt und der Browser die passende Variante für Layoutbreite und Pixeldichte auswählt.

#Webdesign-Grundlagen

Print-Stylesheet

Eigene Regeln für den Ausdruck.

#Frontend-Entwicklung (HTML, CSS, JavaScript)