Schau dir ein Zeitungsfoto genau an und es zerfällt in schwarze Punkte unterschiedlicher Größe Schau dir einen Screenshot des ersten Macintosh an und ein grauer Himmel entpuppt sich als Streuung von schwarz-weißen Pixeln Schau dir einen Game Boy Sprite an und vier Grüntöne zeichnen irgendwie ein Gesicht Keine dieser Anzeigen oder Pressen könnte einen glatten Verlauf zeigen, und alle fälschen einen auf die gleiche Weise: Durch die Anordnung einiger verfügbarer Farben in Mustern wird das Auge wieder in den Ton gemittelt.
Diese Technik ist zögernd Diese Anleitung erklärt, warum es sie gibt, wie sich die wichtigsten Algorithmen in der von ihnen verwendeten Arithmetik unterscheiden, was die Einstellungen in einem Dither-Tool ändern und wie man eine saubere Ausgabe für Bildschirm oder Druck erhält Die gearbeiteten Beispiele verwenden die Toolz Bild Dither Werkzeug, und die Zahlen stammen aus denselben Formeln, die es ausführt.
tl; dr: Dithering gibt ein durchgehendes Tonbild mit einer kleinen Palette, oft nur zwei Farben, wieder, indem es Punkte in Mustern platziert, die das Auge in Zwischentöne einfügt Orded Dithering (Bayer) vergleicht jedes Pixel mit einer festen Schwellenwertmatrix und ergibt eine regelmäßige Kreuzschraffur Fehlerdiffusion (Floyd-Steinberg, Atkinson) schiebt jedes Pixel' s Rundungsfehler auf seine Nachbarn für ein organischeres Korn Halbton variiert die Punktgröße entlang eines gedrehten Bildschirms, wie Druck. Die Bild Dither Werkzeug Bietet sechs Modi, Retro-Paletten, PNG-Export bis zu 8 x und True-Vector-SVG, alle clientseitig, kostenlos, ohne Anmeldung.
Was ist Image Dithering?
Bild-Dithering ist eine Möglichkeit, Töne darzustellen, die eine Palette nicht direkt darstellen kann, indem sie die Farben, die sie darstellen kann, in kleinen Mustern mischt Ein Schwarzweißdrucker kann nicht 50% Grau drucken, aber er kann ein Schachbrett aus schwarzen und weißen Punkten drucken, das aus normaler Betrachtungsentfernung grau aussieht.
Das Problem, das es löst, nennt man QuantisierungJedes Pixel muss in der verfügbaren Palette auf die nächste Farbe gerundet werden, ohne zu zögern, behält eine auf Schwarz und Weiß reduzierte Fotografie nur eine harte Silhouette: Alles, was heller als Mittelgrau ist, wird weiß und alles Dunkler wird schwarz Der Verlauf ist weg Beim Dithering geschieht die Rundung immer noch Pixel für Pixel, aber der Fehler wird durch ein Muster ausgebreitet oder versetzt, sodass die Dichte der dunklen Punkte in jedem Bereich nachzeichnet, wie dunkel dieser Bereich im Original war.
Verschiedene Algorithmen verbreiten diesen Fehler auf unterschiedliche Weise, und das Muster, das jeder hinterlässt, ist seine visuelle Signatur. Deshalb kann & quot; dithered" die ordentliche Kreuzschraffur eines alten PC-Spiels, die körnige Textur von MacPaint oder die runden Punkte eines Bildschirm-gedruckten Posters bedeuten.
Wie unterscheiden sich die Dither-Algorithmen?
Es gibt zwei Familien. Geordnetes Dithering Entscheidet jedes Pixel unabhängig, indem es mit einer Position in einem festen Schwellenwertmuster verglichen wird. Fehlerdiffusion Pixel der Reihe nach entscheidet und jeden Rundungsfehler auf noch nicht verarbeitete Pixel weiterleitet Halbtoning ist ein druckabgeleiteter Verwandter, der die Punktgröße statt der Punktplatzierung ändert.
| Modus im Werkzeug | Familie | Wie es entscheidet | Schau | gut für |
|---|---|---|---|---|
| Bayer 4x4 | Bestellt | Vergleichen Sie den Ton mit einer 4x4-Schwellenwertmatrix | Regelmäßige Kreuzschraffur, sichtbares Muster | Retro-Spiel und früher PC-Stil, Poster |
| Atkinson | Fehlerdiffusion | Schieben Sie 3/4 des Fehlers auf sechs Nachbarn | Hohe Kontrast, ausgeblasene Highlights | Der Macintosh-Look von 1984, Porträts mit Punsch |
| Floyd-Steinberg | Fehlerdiffusion | Schieben Sie den gesamten Fehler auf vier Nachbarn | Feines Bio-Korn, treuester Ton | Fotos, bei denen es auf Details ankommt |
| Halbton | Amplitudenmodulierter Bildschirm | Der Punktradius wächst mit der Dunkelheit auf einem gedrehten Gitter | Runde Punkte in einem Winkel | Poster im Print-Stil, Comic und Pop-Art |
| Cyber-glitch | Palettenschnapper plus Hubraum | Nächste Palettenfarbe pro Block, verschobene Scanlines | Bunte Blöcke mit horizontalen Rissen | Stilisierte Mehrfarbenkunst |
| Hartes 1-Bit | Schwellenwert | Dunkel, wenn der Ton unter 128 liegt | Kein Zögern, reine Silhouette | Logos, Linienkunst, Schablonen |
Die nächsten Abschnitte gehen mit reellen Zahlen durch die Arithmetik, beginnend mit dem Tonwert, den jeder Modus teilt.
Wie wird ein Pixel's-Ton vor dem Dithering berechnet?
Bevor irgendein Muster angewendet wird, wird jedes Pixel in einen einzelnen Helligkeitswert von 0 (schwarz) bis 255 (weiß) umgewandelt Das Tool verwendet die Luma-Gewichte von ITU-R-Empfehlung BT.601welches Gewicht am grünsten ist, weil das menschliche Sehen am empfindlichsten darauf reagiert:
luma = 0.299 R + 0.587 G + 0.114 B + brightness
curved = ((luma / 255 - 0.5) x contrast + 0.5) x 255 clamped to 0..255
Der Helligkeitsschieber verschiebt jedes Pixel um -100 bis +100. Der Kontrastkurvenschieber, 0,5 bis 3 mit einer Voreinstellung von 1,4, streckt Töne vom mittleren Grau weg.
Gearbeitetes Beispiel: ein mittelgraues Pixel RGB (100, 100, 100) bei den Standardeinstellungen.
luma = 0.299(100) + 0.587(100) + 0.114(100) + 0 = 100
curved = ((100 / 255 - 0.5) x 1.4 + 0.5) x 255
= ((0.39216 - 0.5) x 1.4 + 0.5) x 255
= (-0.15098 + 0.5) x 255
= 89.0
Der Standardkontrast drückt also dieses Grau dunkler, von 100 auf etwa 89. Ein Pixel genau bei 128 bewegt sich kaum, und ein Pixel bei 180 bewegt sich heller, Durch das Erhöhen des Kontrasts wird die Ausbreitung erweitert, was weniger Mitteltöne und kräftigere Punktmuster bedeutet.
Wie funktioniert das Dithering bei Bayer?
Bayer-Dithering kachelt eine kleine Matrix von Schwellen über das Bild und markiert ein Pixel dunkel, wenn sein Ton an seiner Position unter den Schwellenwert fällt Die Matrix ist so angeordnet, dass Schwellen möglichst gleichmäßig über die Kachel verteilt werden, die Anordnung, die Bryce Bayer 1973 veröffentlicht hat Das Tool verwendet die 4x4-Version, skaliert auf 0-255:
0 128 32 160
192 64 224 96
48 176 16 144
240 112 208 80
Nimm einen flachen Bereich, wo jedes Pixel den gekrümmten Ton von 89 aus dem obigen Beispiel hat Eine Zelle ist dunkel, wenn 89 unter ihrem Schwellenwert liegt Die Schwellenwerte über 89 sind 96, 112, 128, 144, 160, 176, 192, 208, 224 und 240: zehn der sechzehn. Also bekommen 10 von 16 Zellen Tinte, das ist 62,5% Abdeckung, nahe dem Ton' s Dunkelheit von 1 - 89/255 = 65%.
Jeder Bereich mit dem gleichen Ton bekommt genau das gleiche Muster, und diese Wiederholung ist der Bayer-Look, er produziert nie zufällige Körnung, er kachelt sauber, und er komprimiert gut wie PNG Seine Schwäche ist das Bändern: Ein langsamer Verlauf durchschreitet höchstens 17 verschiedene Muster.
Wie funktioniert die Floyd-Steinberg-Fehlerdiffusion?
Floyd-Steinberg verarbeitet das Bild von links nach rechts, von oben nach unten, jedes Pixel wird auf Schwarz oder Weiß gerundet, und die Differenz zwischen seinem Ton und dem Wert, auf den es gerundet wurde, wird auf vier Nachbarn aufgeteilt, die noch nicht bearbeitet wurden, wobei Gewichte verwendet werden, die zu 16/16 addieren. Robert Floyd und Louis Steinberg veröffentlichten es 1976.
current 7/16
3/16 5/16 1/16
Gearbeitetes Beispiel mit dem Ton von 89. Er liegt unter dem 128 er Cutoff, also wird das Pixel schwarz (0) Der Fehler ist 89 - 0 = 89, der weitergegeben wird:
| Nachbar | Teilen | Zu seinem Ton hinzugefügt |
|---|---|---|
| Recht | 7/16 | 38,9 |
| Unten links | 3/16 | 16.7 |
| Unten | 5/16 | 27,8 |
| Unten rechts | 1/16 | 5.6 |
| Insgesamt | 16/16 | 89,0 |
Das Pixel rechts daneben hat jetzt 89 + 38,9 = 127,9, knapp unter dem Cutoff, also wird es wahrscheinlich auch schwarz und gibt einen eigenen kleineren Fehler weiter, etwas weiter kippt der akkumulierte Fehler ein Pixel über 128 und es wird weiß Über eine Fläche passt der Anteil der schwarzen und weißen Pixel zum Originalton, und weil die Wahl von Nachbarn abhängt, sieht die Maserung eher unregelmäßig als gekachelt aus.
Weil der volle Fehler eingehalten wird, bewahrt Floyd-Steinberg den Gesamtton am besten, weshalb er die Wahl für fotografische Treue ist.
Warum sieht Atkinson beim Zögern so kontrastreich aus?
Atkinson-Dithering, geschrieben von Bill Atkinson für den ursprünglichen Apple Macintosh, verbreitet den Fehler weiter, verliert aber bewusst etwas davon Jeder von sechs Nachbarn erhält 1/8 des Fehlers, so dass nur 6/8 (drei Viertel) weitergegeben wird:
current 1/8 1/8
1/8 1/8 1/8
1/8
Bei gleichem Ton von 89 und einem Fehler von 89 bekommt jeder Nachbar 11,125, also insgesamt 66,75 weitergegeben, und 22,25 wird einfach fallen gelassen Der Abwurffehler schiebt nahezu weiße Bereiche in reinweiße und nahezu schwarze Bereiche in reines Schwarz, sodass Highlights ausblasen, Schatten blockieren und Mitteltöne eine knackige, offene Textur behalten Es ist weniger genau als Floyd-Steinberg und oft attraktiver, insbesondere auf Gesichtern und kleinen Bildschirmen.
Wie funktioniert der Halbtonmodus?
Die Halbtonung variiert die Größe der Punkte und nicht ihre Platzierung Das Werkzeug legt ein Raster von Probenpunkten, die in den Bildschirmwinkel gedreht sind, liest den Ton an jedem Punkt und zeichnet einen Kreis, dessen Radius wächst, wenn der Ton dunkler wird:
radius = (1 - tone / 255) x (pixel scale / 2) x 1.3 capped at pixel scale / 2
dots with a radius of 0.4px or less are not drawn
Mit der Standard-4 px Pixel-Skala:
| Ton | Radius | Ergebnis |
|---|---|---|
| 0 (schwarz) | 2,6, begrenzt auf 2,0 px | Berührende Punkte, einfarbig dunkel |
| 89 | (0,651) x 2 x 1,3 = 1,69 px | Mittlerer Punkt |
| 200 | (0,216) x 2 x 1,3 = 0,56 px | Kleiner Punkt |
| 230 | (0,098) x 2 x 1,3 = 0,25 px | Übersprungen, liest sich als Papier |
Der Standardwinkel beträgt 45 Grad, die Konvention für einen einfarbigen Bildschirm, da ein Diagonalgitter für das Auge weniger auffällig ist als Reihen, die mit den Seitenrändern ausgerichtet sind Winkel nahe 0 oder 90 erzeugen sichtbare horizontale oder vertikale Linien Der Winkelschieber betrifft nur diesen Modus.
Was ändern sich die Pixelskala, die Paletten und die Einstellungen für Invertierungen?
Pixelskala (2 bis 32 px, Standard 4) legt die Größe jedes Blocks oder jeder Punktzelle fest Das Werkzeug probt ein Pixel pro Zelle ab, anstatt die Zelle zu mitteln, sodass sehr feine Details, die kleiner als eine Zelle sind, verschwinden oder Moiré-Muster auf Stoffen und Gittern erzeugen können Größere Zellen geben ein klobigeres, grafischeres Poster; kleinere Zellen halten mehr Details und erzeugen größere SVG-Dateien.
Paletten Farben einstellen Es sind fünf Voreinstellungen enthalten: Brutal Paper (Papyrus, Hazard Yellow, Charcoal), Mac OS 1984 (Weiß, Grau, Schwarz), Gameboy Classic (vier Grüns), Cyberpunk Neon und Synthwave 80 s, dazu Custom Colors mit eigenem Hintergrund und Vordergrund Fünf der sechs Modi sind zweifarbig und verwenden nur die erste und letzte Palettenfarbe Deshalb zeigt Gameboy Classic nur sein hellstes und dunkelstes Grün in Bayer oder Floyd-Steinberg Cyber Glitch ist der eine Modus, der jeder Farbe in der Palette zugeordnet wird.
Invertieren Vertauscht Hintergrund und Vordergrund gegen helle Punkte auf einem dunklen Feld.
Welche Größe können Sie exportieren und wann sollten Sie SVG verwenden?
Das Foto wird zuerst mit einer Abdeckung auf eine feste Bühne gepasst, so dass eine 6000 px-Kameradatei so schnell wie eine kleine rendert Ziehen Sie in die Leinwand, um den Zuschnitt neu zu positionieren.
| Seitenverhältnis | Stufe (1x) | 2 x (Standard) | 4x | 8x |
|---|---|---|---|---|
| Original | 840 px breit | 1680 breit | 3360 breit | 6720 breit |
| 1:1 Quadrat | 840 x 840 | 1680 x 1680 | 3360 x 3360 | 6720 x 6720 |
| 16:9 Landschaft | 1120 x 630 | 2240 x 1260 | 4480 x 2520 | 8960 x 5040 |
| 9:16 vertikal | 630 x 1120 | 1260 x 2240 | 2520 x 4480 | 5040 x 8960 |
| 4:3 klassisch | 1040 x 780 | 2080 x 1560 | 4160 x 3120 | 8320 x 6240 |
Ein PNG-Export vergrößert die Vorschau nicht, er zeichnet die Quelle in der Zielgröße neu und führt den Dither erneut mit der Pixelskala multipliziert mit der Exportskala aus, so wird bei 4 x ein 4 px Punkt zu einem knackigen 16 px Punkt anstatt zu einer unscharfen Vergrößerung Das Rendern erfolgt mit der HTML-Canvas-API, die große Bitmaps im Speicher hält; wenn ein 8-facher Export mit & quot; Export fehlgeschlagen ist Versuchen Sie es mit einem kleineren Exportmaßstab.", tun Sie das.
SVG-Export schreibt jeden Punkt als real <rect> oder <circle> Element, im Anschluss an die W3 C SVG Spezifikation‘sodass das Poster ohne Resampling auf jede beliebige Druckgröße skaliert und in einem Vektoreditor geöffnet wird Der Posterkartentext bleibt als bearbeitbarer Text Der Kompromiss ist Dateigröße Eine 4 px-Skala auf einer Stufe 840 x 1120 hat 210 x 280 = 58.800 Zellen, und ein dunkles Rect-Mode-Bild kann die meisten davon als separate Elemente von jeweils etwa 55 Zeichen schreiben, was sich 3 MB nähert Durch Verdoppeln der Pixelskala auf 8 wird die Zellenzahl auf ein Viertel reduziert SVG für Druck und Bearbeitung verwenden, PNG für das Web.
Der CRT-Scanline-Effekt erreicht nie einen Export; es handelt sich nur um ein Preview-Overlay Das Posterkarten-Overlay hingegen ist Teil des Exports und ist standardmäßig mit dem Platzhalter-Header " DITHERED // 2026" untick & quot; Posterkarten-Overlay" wenn Sie das Bild alleine haben möchten, aktiviert.
Werden meine Bilder hochgeladen?
Nein. Die Datei wird als lokale Objekt-URL geöffnet, auf eine Leinwand gezeichnet und im selben Browser-Tab gedithert. Keine Anfrage trägt Bilddaten, so dass unveröffentlichte Fotos oder Client-Assets auf Ihrem Gerät bleiben und das Tool nach dem Laden weiter mit dem Netzwerk aus der Zwischenablage mit Strg+V oder Cmd+V einfügen funktioniert auch.
Bei den eingebauten Proben (Earthrise, Blue Marble und ein Mondstartabdruck) handelt es sich um NASA-Fotografien Werke der US-Bundesregierung unterliegen nicht dem Urheberrecht unter 17 USC 105, weshalb sie als Muster versenden können Für eigene Uploads fügt das Tool kein Wasserzeichen hinzu und beansprucht keine Rechte; die üblichen Grenzen sind alle Rechte, die Sie im Quellbild halten.
Auf welche Fehler kann man da stoßen?
| Nachricht oder Symptom | Ursache | Fix |
|---|---|---|
| " Diese Datei ist kein Bild. " | Der Datei-'s-Typ ist kein Bild | Konvertieren Sie es zuerst, zum Beispiel mit einem Bildformat-Konverter |
| " Dieses Bild konnte nicht dekodiert werden. " | Der Browser kann dieses Format nicht lesen, beispielsweise HEIC außerhalb von Safari | In JPG oder PNG umwandeln |
| " Export fehlgeschlagen Versuchen Sie es mit einem kleineren Exportmaßstab." | Der Browser konnte die große Leinwand nicht zuweisen | Wählen Sie 4 x oder 2x |
| " Das Lesen des Zwischenablagebretts wurde blockiert..." | Der Browser verweigerte den Zugriff der Zwischenablage auf die Schaltfläche | Drücken Sie stattdessen Strg+V oder Cmd+V auf der Seite |
| Palette zeigt nur zwei Farben | Zweifarbige Modi verwenden die erste und letzte Farbe | Wechseln Sie zu Cyber Glitch oder legen Sie benutzerdefinierte Farben fest |
| Moire oder schimmernde Muster | Feines regelmäßiges Detail kleiner als die Pixelskala | Heben Sie die Pixelskala an oder verwischen Sie die Quelle zuerst leicht |
| SVG viel größer als PNG | Ein Element pro Punkt | Erhöhen Sie die Pixelskala oder exportieren Sie PNG |
Transparente Bereiche in einem PNG werden vor dem Dithering auf Weiß gelegt und lauten daher als Papier.
Alternativen zum Dithering eines Bildes
| Werkzeug | Wie | Notizen |
|---|---|---|
| GIMP | Bild, Modus, indiziert, mit Floyd-Steinberg-Zögern | Palettenbasiert, kein Halbton-Bildschirmwinkel |
| Photoshop | Graustufen, dann Bitmap-Modus mit Halbtonbildschirm oder Diffusion Dither | Druckorientiert, bezahlt |
| ImageMagick | magick in.jpg -colorspace Gray -ordered-dither o4x4 out.png |
Skriptfähig, viele Schwellenwertkarten |
| ImageMagick | magick in.jpg -dither FloydSteinberg -monochrome out.png |
Fehlerdiffusion nach Schwarz und Weiß |
| Toolz Bild Dither | Sechs Modi, Paletten, Vektor SVG | Client-Seite, Vorschau beim Ziehen |
Befehlszeilenwerkzeuge gewinnen für Chargen Ein interaktives Tool gewinnt, wenn der Look vom Nudging-Kontrast und der Punktgröße abhängt, während das Ergebnis beobachtet wird.
Wenn das gezitterte PNG auf eine Website zusteuert, ist die Bildkomprimierungshandbuch Umfasst, wie man es weiter verkleinert; Bilder mit nur zwei Farben komprimieren sich extrem gut als PNG. Für die Umwandlung der Ausgabe in ein anderes Format, die Bildformat-Konverter-Handbuch Erklärt, wann PNG, WebP oder GIF passt Das volle Set lebt auf dem Bildwerkzeuge HubUnd das können Sie Versuchen Sie es mit dem Dithering-Tool Mit einem der NASA-Samples vor dem Laden des eigenen Fotos.
