Bild verpixeln
Ein Bild mit 1920 × 1080 Pixeln braucht bei 16-Pixel-Blöcken 120 Spalten mal 68 Reihen, insgesamt 8160 Blöcke, und die letzte Reihe ist nur 8 Pixel hoch. Planen Sie das Raster der Verpixelung, bevor Sie eine Farbe anfassen. Kostenlos in Ihrem Browser.
- Kostenlos
- Läuft in Ihrem Browser
- Ohne Anmeldung
- Ihre Daten bleiben auf Ihrem Gerät
Im Browser ausführen – kostenlos
Rechenbeispiel
- Breite
- 1.920
- Höhe
- 1.080
- Blockgröße
- 16
- Spalten
- 120
- Zeilen
- 68
- Blöcke insgesamt
- 8.160
- Breite des rechten Rands
- 16
Der Rechner für Bildverpixelung wandelt Bildbreite, Bildhöhe und die Seitenlänge eines quadratischen Blocks in das genaue Raster für einen Verpixelungseffekt um. Er liefert die Anzahl der Spalten und Zeilen, die Gesamtzahl der Blöcke sowie die Maße unvollständiger Blöcke am rechten und unteren Rand. Damit können Sie Filter planen, Mosaike erzeugen, den Aufwand abschätzen oder eine Designvorschau mit der Implementierung abgleichen. Die Berechnung ist deterministisch und erfordert weder das Hochladen noch das Dekodieren eines Bildes.
Wandeln Sie Pixelmaße in ein Blockraster um
Bei einem Verpixelungseffekt werden Gruppen benachbarter Quellpixel durch eine einzige repräsentative Farbe ersetzt. Noch vor der Farbverarbeitung muss eine Implementierung wissen, wie viele Gruppen horizontal und vertikal in das Bild passen. Geben Sie Breite und Höhe in Pixeln ein und wählen Sie anschließend die Seitenlänge jedes quadratischen Blocks.
Der Rechner teilt beide Maße durch die Blockgröße und rundet auf. Dieses Aufrunden ist erforderlich, weil ein Bildmaß nicht immer ein genaues Vielfaches der gewählten Größe ist. Auch ein schmaler Rest am rechten Rand benötigt eine eigene Spalte; andernfalls bliebe ein Streifen unbearbeitet.
Sie können diese Werte als Schleifengrenzen, zur Canvas-Planung, für Aufwandsschätzungen, Testdaten und Oberflächenvorschauen verwenden. Das Werkzeug berechnet ausschließlich Geometrie. Es liest keine Bilddaten, ermittelt keine Farben, skaliert keine Dateien und erzeugt kein bearbeitetes Bild.
Identische Eingaben führen daher unabhängig vom Bildformat stets zum gleichen Ergebnis.
Verstehen Sie Teilblöcke an den Bildrändern
Sind beide Bildmaße ohne Rest durch die Blockgröße teilbar, besitzen alle Rasterzellen dieselben Abmessungen. Reale Bildgrößen hinterlassen jedoch häufig einen Rest. Die letzte Spalte kann schmaler und die letzte Zeile niedriger sein.
Gibt es keinen Rest, entspricht der jeweilige Randwert der vollständigen Blockgröße und nicht null, denn der letzte Block ist ein normaler Vollblock. Bei einem Rest nennt der Wert genau die Zahl der verbleibenden Quellpixel.
Wählen Sie eine gültige und sinnvolle Blockgröße
Breite, Höhe und Blockgröße müssen positive ganze Zahlen sein, da der Rechner einzelne Bildpixel modelliert. Zudem muss der quadratische Block in beide Bildmaße passen. Innerhalb des gültigen Bereichs bewahren kleinere Blöcke mehr erkennbare Details und erzeugen mehr Rasterzellen.
Größere Blöcke führen zu einer gröberen Abstraktion mit weniger Zellen. Vergleichen Sie mehrere Größen, um die gewünschte Optik und den Verarbeitungsaufwand abzuwägen, bevor Sie einen echten Bildfilter ausführen. Berechnen Sie responsive Vorschauen bei jeder Änderung der Quellmaße oder Blockgröße neu, anstatt einen alten Rasterwert zu skalieren, denn durch die Rundung am Rand kann sich die Zeilen- oder Spaltenzahl ändern.
Bildpixel werden auf keinem Weg übertragen, da nur numerische Maße erforderlich sind.
Anwendungsfälle
Canvas-Schleifen für Verpixelung planen
Ermitteln Sie genaue Zeilen- und Spaltengrenzen, bevor Sie quadratische Farbbereiche abtasten und auf ein Canvas zeichnen.
Aufwand eines Mosaiks abschätzen
Vergleichen Sie anhand der Gesamtzahl der Blöcke den Verarbeitungsaufwand verschiedener Blockgrößen.
Ungleichmäßige Bildränder behandeln
Nutzen Sie die rechten und unteren Randmaße, damit keine Pixel abgeschnitten oder außerhalb des Bildes gelesen werden.
Häufige Fragen
Warum wird ein Block abgelehnt, der größer als das Bild ist?
Der quadratische Block muss in beide Bildmaße passen.
Wie viele Blöcke ergibt ein Bild mit 1920 × 1080 bei 16-Pixel-Blöcken?
Es ergibt 120 Spalten mal 68 Reihen, also 8160 Blöcke. Die Breite geht glatt auf, aber 1080 ist kein Vielfaches von 16, deshalb ist die unterste Reihe nur 8 Pixel hoch.
Warum rundet der Rechner auf und nicht ab?
Weil auch der schmale Streifen, der rechts oder unten übrig bleibt, eigene Blöcke braucht. Abrunden würde diesen Streifen unbearbeitet lassen; beim Aufrunden gehört jedes Pixel zu genau einem Block.
Welche Blockgröße sollte ich wählen?
Kleine Blöcke erhalten mehr erkennbare Details und ergeben mehr Blöcke; große Blöcke wirken gröber und abstrakter, mit weniger Blöcken. Probieren Sie mehrere Größen aus und vergleichen Sie die Zahlen, bevor Sie den echten Filter anwenden.
Verpixelt das Werkzeug mein Foto?
Nein. Es berechnet nur die Geometrie des Rasters aus Breite, Höhe und Blockgröße. Es öffnet nie das Bild, liest keine Farben und erzeugt keine neue Datei, daher liefern dieselben Zahlen immer dasselbe Raster.
Verwandte Tools
Für Entwickler — API-Zugang
Alles auf dieser Seite ist auch per API verfügbar. Dieser Abschnitt richtet sich an Teams, die es in ihre eigenen Systeme einbinden möchten; alle anderen nutzen einfach das Tool oben.
Endpunkt
Authentifizierung per Bearer-Token. Ein einziger POST stellt die Aufgabe in die Warteschlange; das Ergebnis erhalten Sie per Webhook oder über einen signierten Link.
Aufruf aus Ihrem Stack
curl -X POST https://api.kit.forhosting.com/image/pixelate \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"width":1920,"height":1080,"block_size":16}'const res = await fetch("https://api.kit.forhosting.com/image/pixelate", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"width": 1920,
"height": 1080,
"block_size": 16
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/image/pixelate",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"width": 1920,
"height": 1080,
"block_size": 16
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/image/pixelate", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"width":1920,"height":1080,"block_size":16}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"width":1920,"height":1080,"block_size":16}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/image/pixelate", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Beispiel-Anfrage
{
"width": 1920,
"height": 1080,
"block_size": 16
}Beispiel-Antwort
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "image.pixelate",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}Die API arbeitet asynchron: Sie erhalten sofort eine task_id. Polling ist mit 1 Anfrage pro Sekunde erlaubt.
Preis
Der Preis steht auf der Seite – keine Tokens, keine Credits. Fehlgeschlagene Aufgaben werden nicht berechnet.
Limits
max_mb | 15 |
max_megapixels | 12 |
Fehler
| HTTP | Code | Bedeutung |
|---|---|---|
401 | unauthorized | Der API-Schlüssel fehlt oder ist ungültig – prüfen Sie den Authorization-Header (Bearer). |
402 | insufficient_balance | Ihr Guthaben reicht für diese Aufgabe nicht aus – Aufladungen verfallen nicht. |
404 | unknown_type | Unbekannter Aufgabentyp – prüfen Sie das Feld „type“ gegen den Katalog. |
429 | rate_limited | Zu viele Anfragen – warten Sie kurz; Polling ist mit 1 Anfrage pro Sekunde erlaubt. |
Technische Hinweise
Wandeln Sie Pixelmaße in ein Blockraster um
Die ausgegebenen Spalten und Zeilen beschreiben das vollständige Raster, total_blocks ist ihr Produkt.
Verstehen Sie Teilblöcke an den Bildrändern
Die Ergebnisse right_edge_width und bottom_edge_height weisen diese Randfälle ausdrücklich aus. Diese Regel vereinfacht den Rendering-Code: Gewöhnliche Zellen verwenden block_size, die letzte Spalte und Zeile dagegen die ausgegebenen Randmaße. Das Raster basiert weiterhin auf aufgerundeter Division, sodass jedes Quellpixel genau einer Zelle zugeordnet wird. Dies hilft besonders, wenn Sie Abtastbereiche zuschneiden, Puffer für Kacheln reservieren oder prüfen möchten, dass berechnete Bereiche niemals über die Grenzen des ursprünglichen Bildes hinausreichen.
Wählen Sie eine gültige und sinnvolle Blockgröße
Ist er größer als eine der Seiten, kann das gewünschte Raster nicht entstehen; deshalb wird invalid_input statt eines mehrdeutigen Ergebnisses zurückgegeben. Die Browserversion arbeitet lokal; automatisierte API-Anfragen kosten jeweils $0.002.
Technische Fragen
Wie werden Spalten und Zeilen berechnet?
Jedes Bildmaß wird durch block_size geteilt und aufgerundet, damit Teilblöcke am rechten und unteren Rand enthalten sind.
Was geschieht bei einer Division ohne Rest?
Die Randmaße entsprechen block_size, weil die letzte Spalte und die letzte Zeile aus vollständigen Blöcken bestehen.
Verändert oder überträgt das Werkzeug mein Bild?
Nein. Es verarbeitet nur width, height und block_size und berechnet die Geometrie, ohne eine Bilddatei zu lesen.
Was kostet eine API-Anfrage?
Jede API-Anfrage kostet $0.002. Dieselbe deterministische Berechnung steht im Browser kostenlos bereit.