Entfernen Sie einen Bildhintergrund im Browser: Was ein Farbschlüssel-Entferner tatsächlich tut

Ich brauchte vierzig Produktaufnahmen für eine WP-Administrations-Promo-Seite und wollte nicht pro Bild bezahlen oder die Modelle auf jemanden auf den Server hochladen, bevor sie öffentlich waren. Also habe ich einen Hintergrundentferner eingebaut Toolz.dev, warf mein erstes Foto darauf und sah zu, wie es ein Loch direkt in der Mitte des Produkts aß.

Das Foto war eine weiße Plugin-Box auf einem weißen Schreibtisch Das Tool entfernte den Schreibtisch, es entfernte auch die Box, denn die Box war genauso weiß wie der Schreibtisch Ich hatte angenommen, ich baue etwas Gescheites und KI-förmig, ich hatte tatsächlich etwas viel Einfacheres gebaut, und das Loch in meinem Produkt hat mich genau gelehrt, was es war - und, nützlicher, genau, wann es schön funktioniert und wann es versagt.

Diese Anleitung ist diese Lektion aufgeschrieben Es ist ehrlich darüber, was ein Browser-basierter Farbschlüsselentferner tun kann, denn ein Tool, das bei Haaren und gleichfarbigen Motiven leise ausfällt, ist schlimmer als gar kein Tool, wenn Sie seine Kanten nicht kennen Hier läuft alles clientseitig - Ihr Bild wird dekodiert, verarbeitet und heruntergeladen, ohne jemals die Registerkarte zu verlassen.

tl; dr: der Hintergrundentferner Abtastwerte die Farbe in der oberen linken Ecke Ihres Bildes und löscht jedes Pixel nahe dieser Farbe, wodurch Transparenz zurückbleibt (PNG heraus).Es ist eine Farbtaste, kein KI-Ausschnitt. Das bedeutet, dass es sofort, privat und wirklich ausgezeichnet ist auf flachen, einfarbigen Hintergründen - Produktaufnahmen, Logos, flache Illustrationen, Screenshots - und wirklich schlecht auf belebten Fotos, Farbverläufen, Haaren und jedem Motiv, das eine Farbe mit seinem Hintergrund teilt Drehen Sie die Toleranz Schieber nach oben, um mehr zu entfernen, nach unten zu schützen. Müssen Sie das Ergebnis danach in JPG umwandeln? der Bildformat-Konverter Tut das, aber Sie verlieren die Transparenz.

Was ist das für ein Hintergrundentferner?

Es gibt zwei sehr unterschiedliche Werkzeugfamilien, die sich beide als "Hintergrundentferner" bezeichnen. Und die Auswahl der falschen für Ihr Bild ist der häufigste Grund, warum Menschen frustriert sind.

Die erste Familie ist KI-Segmentierungdrohen Ein auf Millionen von beschrifteten Fotos geschultes maschinelles Lernen, das auf Ihr Bild trainiert, entscheidet sich für "Dies ist ein Hund, dies ist eine Couch hinter dem Hund", und verfolgt den Hund. Dies ist, was Remove.bg und die kostenpflichtigen Cloud-Tools tun. Es behandelt Haare, Fell und überfüllte Hintergründe, weil es versteht Fächer, nicht nur Farben. Die Kosten: Es wird normalerweise Ihr Bild auf einen Server hochgeladen, es benötigt das trainierte Modell und es ist langsamer.

Die zweite Familie ist eine Farbtaste- manchmal auch Chroma-Keying genannt, die gleiche Idee wie ein Greenscreen im Film Es versteht überhaupt nicht, was auf Ihrem Foto ist Es wählt eine Hintergrundfarbe aus und löscht jedes Pixel in der Nähe dieser Farbe Der Toolz.dev Background Remover ist diese zweite Art. Es sampelt das Pixel in der Linke oben Behandelt das als "Hintergrund" und geht jedes Pixel aus, das entscheidet: Ist dies der Eckfarbe zum Löschen nahe genug?

Beides ist abstrakt besser. Sie sind gut in verschiedenen Bildern. Sobald Sie feststellen können, welches Bild Sie halten, werden Sie aufhören, gegen das Werkzeug zu kämpfen.

Wie entscheidet der Farbschlüssel-Entferner, was gelöscht werden soll?

Der Mechanismus ist es wert, verstanden zu werden, weil er jeden Erfolg und jeden Misserfolg erklärt, den Sie jemals daraus machen werden.

Wenn Sie Vorschau drücken, liest das Tool die Farbe des oberen linken Eckpixels - nennen Sie es die Referenz. Dann addiert es für jedes Pixel im Bild, wie weit dieses Pixel von der Referenz über die drei Farbkanäle entfernt ist:

difference = |R - refR| + |G - refG| + |B - refB|

Das ist eine einfache Summe der roten, grünen und blauen Entfernungen (eine Manhattan-Entfernung, wenn Sie den Begriff wollen). Wenn die Gesamtsumme difference ist unter deinem Toleranz Einstellung wird das pixel' s alpha auf Null gesetzt - es wird transparent, liegt es darüber, bleibt das Pixel.

Drei Konsequenzen fallen direkt aus dieser Formel, und sie sind die ganze Geschichte:

zuerst, Die Ecke muss Hintergrund sein. Das Tool geht davon aus, dass das obere linke Pixel Teil dessen ist, was Sie weg wollen. Wenn Ihr Motiv in diese Ecke reicht, sagen Sie dem Werkzeug, dass Ihr Motiv der Hintergrund ist. Zuschneiden oder neu frame, damit die Ecke sauber ist.

Erster Cousin dazu: Der Hintergrund muss ungefähr eine Farbe sein. Ein flacher weißer Studio-Sweep ist eine Farbe Ein verschwommenes Café, ein Himmelsverlauf, ein Holzschreibtisch mit Maserung - das sind viele Farben, und das Werkzeug wusste nur von dem in der Ecke. Es löscht die zufällig passenden Teile und lässt den Rest als hässliche Fransen zurück.

Zweitens, Jede Betrefffarbe, die dem Hintergrund entspricht, wird ebenfalls gelöscht. Meine weiße Box auf dem weißen Schreibtisch ist der kanonische Reinfall Eine Person im grauen Hemd an einer grauen Wand verliert das HemdDas Werkzeug hat keine Ahnung, dass das Hemd " subject" - es sieht nur Grau in der Nähe des Referenzgrau.

Wenn dieses Werkzeug genau richtig ist

Ich greife trotz der Grenzen immer wieder danach, da es für eine bestimmte und sehr häufige Gruppe von Bildern schneller und privater ist als alles andere Cloud-basiert. es scheint auf:

Produktfotos auf einem soliden Sweep. Schießen Sie auf einem einfarbigen weißen oder einfarbigen Hintergrund - ein Blatt Papier, eine einfache Rolle Hintergrund, eine Lightbox - und der Ausschnitt ist mit einem Klick sauber. Dies ist der E-Commerce-Workflow: Bei Amazon werden effektiv weiße Hintergrundproduktbilder benötigt und bei Etsy und eBay erwartet.

Logos und flache Grafiken. Ein Logo exportiert auf einem soliden Hintergrund, eine flache Illustration, ein Icon - diese sind bereits aus ein paar flachen Farben, was genau das ist, was ein Farbtasten will.

Screenshots und UI-Aufnahmen. Ein Screenshot mit einer einheitlichen Symbolleiste oder einer Leinwand-Farbtaste wird sauber ausgedrückt, wenn Sie nur den Inhalt benötigen.

Alles, was Sie grün gescreent haben. Wenn Sie den Dreh kontrollieren und Ihr Motiv gegen eine flache, kontrastierende Farbe setzen können, die das Motiv ausführt nicht Tragen Sie, dieses Werkzeug ist wirklich professionell.

Wann etwas anderes zu benutzen

Seien Sie ehrlich zu sich selbst über das Bild, bevor Sie zehn Minuten mit Toleranz-Slidern verschwenden:

Fotos von Menschen mit sichtbarem Haar. Feine Stränge vor jedem Hintergrund sind das schwierigste Problem auf dem Feld, und ein Farbschlüssel kann dies nicht. Greifen Sie nach einem KI-Tool.

beschäftigt oder mit Farbverlauf Hintergründe. Straßen, Zimmer, Himmel, Bokeh - viele Farben, eine Referenz, garantierte Fransen.

Themen, die die Hintergrundfarbe teilen. Keine Schiebereglereinstellung Fixiert ein weißes Objekt auf Weiß. Entweder auf einem kontrastierenden Hintergrund aufnehmen oder Segmentierung verwenden.

So entfernen Sie Schritt für Schritt einen Hintergrund auf Toolz.dev

Die Schnittstelle ist bewusst klein. Es gibt keinen Account, keinen Upload, kein Wasserzeichen.

Schritt 1: Öffnen Sie das Werkzeug

Gehe zum Hintergrundentfernerdrohen Das Ganze wird als Seite geladen, es gibt kein Modell zum Herunterladen und keinen Serveraufruf.

Schritt 2: Laden Sie Ihr Bild hoch

Klicken Sie auf die Drop-Zone und wählen Sie eine Datei aus (JPG, PNG oder WebP Alle Arbeiten).Es wird direkt in die Seite eingelesen Überprüfen Sie, dass die Die obere linke Ecke ist Hintergrund- das ist die eine Rahmenregel, die zählt Wenn dein Motiv in diese Ecke geklemmt wird, wird das Ergebnis falsch sein, egal was du als nächstes tust.

Schritt 3: Toleranz einstellen und dann Vorschau

der Toleranz Der Schieberegler läuft von 0 bis 200 und beginnt bei 50. Bei geringer Toleranz werden nur Farben entfernt, die sich nahe an der Ecke befinden (sicher, aber möglicherweise einen Halo von Pixeln mit nahem Hintergrund). Hohe Toleranz entfernt eine größere Bandbreite an Farben (sauberer Sweep, aber fressen in Kanten und jede passende Motivfarbe). stoßen an Vorschau und schauen Sie sich das Schachbrett an - dieses Muster ist der transparente Bereich.

Schritt 4: Stimmen

Wenn der Hintergrund überlebt, stupsen Sie die Toleranz auf und eine Vorschau erneut. Wenn Ihr Motiv seine Kanten verliert oder Löcher bekommt, stoßen Sie es an. Sie suchen nach der Einstellung, die den Hintergrund löscht, ohne das Motiv zu berühren. Für einen gut geschossenen flachen Hintergrund gibt es normalerweise eine breite, bequeme Reichweite, die funktioniert.

Schritt 5: PNG herunterladen

knips PNG herunterladen. Die Ausgabe ist immer PNG, weil PNG das gängige Webformat ist, das Transparenz unterstützt - das ist der springende Punkt Die Datei wird im Browser generiert und direkt auf Ihrem Computer gespeichert.

Color Key vs. AI Cutout: Welche möchten Sie eigentlich?

Die Reihe, die es für mich entscheidet, ist Datenschutz plus flache Hintergründedrohen Wenn ich den Dreh kontrolliere, kontrolliere ich den Hintergrund und dann schlägt der ehrliche, langweilige Farbschlüssel das clevere KI-Tool auf Geschwindigkeit und beim Senden meiner unveröffentlichten Assets nie irgendwohin.

Ein paar Gewohnheiten, die sauberere Ergebnisse erzielen

Schießen Sie für das Werkzeug. Der größte Hebel ist nicht die Software, sondern der Eingang. Ein Thema auf einem schlichten, kontrastreichen, gleichmäßig beleuchteten Hintergrund wird mit einem Klick herausgeschnitten. Fünf Minuten, ein Blatt Papier schlägt eine Stunde Slider-Wrestling.

Halten Sie die Ecke sauber. Rahmen, damit das obere linke Pixel eindeutig Hintergrund ist. Es ist das Werkzeug nur Referenz.

Kontrast schlägt Toleranz. Wenn Ihr Motiv und Ihr Hintergrund farblich nahe beieinander liegen, speichert Sie kein Schieberegler - ändern Sie den Hintergrund, nicht die Einstellung.

Größe vorher ändern, danach komprimieren. Wenn das endgültige Bild im Web läuft, führen Sie den Ausschnitt durch die Bildgröße ändern Werkzeug für genaue Abmessungen, dann die Bildkompressor um die Datei zu verkleinern. mach das hinter Entfernen, damit Sie das Randdetail nicht komprimieren, das Sie noch benötigen.

Behalte es PNG, bis du fertig bist. Jeder Zwischenschritt sollte PNG bleiben, damit die Transparenz erhalten bleibt. Nur dann für das endgültige Ziel auf JPG platt machen, wenn dieses Ziel kein PNG aufnehmen kann - und wissen, dass der transparente Bereich zu einer festen Füllung wird, wenn Sie dies tun.

Häufig gestellte Fragen

Verwendet dieses Tool KI, um Hintergründe zu entfernen?

Nein, und das ist gewollt Es ist ein Farbschlüsselentferner: Er sampelt die obere linke Eckfarbe und löscht Pixel in der Nähe davon, komplett in Ihrem BrowserDas macht es sofort und völlig privat, aber es bedeutet, dass es auf flachen, soliden Hintergründen funktioniert, anstatt auf komplexen Fotos, wie es ein KI-Modell tun würde Das sagt das Tool's eigene Notiz - für geschäftige Hintergründe passt ein KI-Ausschnitt besser.

Warum hat es einen Teil meines Betreffs gelöscht?

Weil ein Teil Ihres Motivs farblich nahe am Hintergrund war. Das Tool löscht nach Farbe, nicht indem es erkennt, was das Motiv ist, also wird ein weißes Hemd an einer weißen Wand oder ein Produkt, das auf dem Schreibtisch steht, zusammen mit dem Hintergrund entfernt. Der Fix ist ein Hintergrund, der sich vom Motiv abhebt, nicht von einer anderen Einstellung des Schiebereglers.

Was ändert sich der Toleranzschieber?

Es ist der Grenzwert dafür, wie unterschiedlich ein Pixel von der Eckfarbe sein kann und trotzdem gelöscht wird. Geringe Toleranz entfernt nur nahezu identische Farben (sicher, kann aber einen Heiligenschein hinterlassen). Hohe Toleranz entfernt einen größeren Bereich (Reiniger auf flachem Sweep, frisst aber Kanten). Es läuft 0 bis 200 und ist standardmäßig 50, Vorschau und Anpassung, bis der Hintergrund gelöscht wird, ohne das Motiv zu berühren.

Warum ist der Ausgang immer ein PNG?

Weil PNG Transparenz unterstützt und JPG nicht. Das Entfernen eines Hintergrunds bedeutet, Pixel transparent zu machen, und nur ein Format mit einem Alphakanal kann dies speichern. Wenn Sie dasselbe Bild wie JPG exportieren, wird der transparente Bereich auf eine feste Farbe, normalerweise weiß, zusammengebrochen.

Kann ich den Hintergrund von einem Foto einer Person entfernen?

Nur wenn es sich um eine saubere Aufnahme im Studiostil vor einem flachen, kontrastierenden Hintergrund handelt und die Person nicht in der Nähe dieser Farbe ist Bei Alltagsfotos mit Haaren vor einem realen Hintergrund hinterlässt dieses Tool Randbilder - das ist der Fall, bei denen ein KI-Segmentierungstool seinen Lebensunterhalt verdient.

Wird mein Bild irgendwo hochgeladen?

kein drohen Das Bild wird auf der Seite des Browsers dekodiert und verarbeitet, und das PNG wird beim Herunterladen lokal generiert. Es wird nichts an einen Server gesendet, weshalb es sicher ist, Produktaufnahmen und Assets zu verwenden, die noch nicht öffentlich sind.

Wie entferne ich einen weißen Hintergrund aus einem Bild?

Dies ist der Fall, für den das Werkzeug gebaut ist Ein weißer Hintergrund ist flach und gleichmäßig, so landet das Eckmuster auf reinem Weiß und eine mäßige Toleranz räumt das ganze Feld in einem Durchgang ab Das Bild fallen lassen, die Vorschau überprüfen und die Toleranz nur dann anstupsen, wenn ein schwacher grauer Rand in der Nähe der Ränder überlebt - Studioaufnahmen und gescannte Logos haben oft einen leicht cremefarbenen Farbverlauf statt echter #FFFFFF. Das Einzige, was Sie beobachten sollten, ist Weiß in Ihrem Motiv: Ein weißer Becher oder ein weißes Hemd verschwinden zusammen mit dem Hintergrund, da das Werkzeug eher zur Farbe passt als Objekte erkennt.

Warum hat mein Ausschnitt eine weiße oder farbige Kante?

Dieser Rand ist Anti-Aliasing Das Originalbild hat das Motiv gemischt' s Kantenpixel teilweise in die Hintergrundfarbe eingefügt, um die Kontur glatt aussehen zu lassen, sodass diese gemischten Pixel weder Motiv noch Hintergrund sind - sie sitzen knapp außerhalb der Toleranzgrenze und überleben die Löschung. Wenn Sie die Toleranz etwas erhöhen, frisst sie normalerweise den Heiligenschein, obwohl zu weit zu drücken beginnt, in das Motiv selbst zu beißen. Wenn der Rand bei jeder Einstellung bestehen bleibt, fehlt dem zugrunde liegenden Bild einfach genügend Kontrast an der Grenze, und eine Aufnahme vor einem kontrastreicheren Hintergrund wird in einer Sekunde beheben, was kein Schieber kann.

Wie setze ich danach eine feste Farbe hinter mein Ausschnittsthema?

Platzieren Sie das transparente PNG in einem beliebigen Editor auf einer farbigen Ebene oder exportieren Sie über die Bildformat-Konverter, die den transparenten Bereich mit einer Hintergrundfarbe füllt. Für den Webgebrauch ist ein transparenter PNG, der auf einen CSS-Hintergrund abgelegt ist, normalerweise der sauberere Pfad.

Abschluss

Der Fehler, den ich bei dieser ersten Produktaufnahme gemacht habe - einen KI-Ausschnitt zu erwarten und einen Farbschlüssel zu bekommen - ist der Fehler, den fast jeder bei Browser-Hintergrundentfernern macht, und er ist völlig vermeidbar, sobald man weiß, was man in der Hand hält Dieses Tool macht eines: Es löscht die Hintergrundfarbe und hinterlässt Transparenz. Geben Sie ihm einen flachen, kontrastierenden Hintergrund und es ist schnell, kostenlos, unbegrenzt und privat, sodass kein Upload-basiertes Tool mithalten kann. Geben Sie ihm Haare vor einer überfüllten Straße und es wird Sie enttäuschen, und jetzt wissen Sie, dass Sie stattdessen nach einem anderen Tool greifen müssen.

Beginnen Sie mit dem Hintergrundentfernerdrohen Reinigen Sie den Schuss danach mit Bildgröße ändern und das Bildkompressor, und konvertieren Formate mit dem Bildformat-Konverter Wenn es sein muss In Ihrem Browser läuft alles - nichts, was Sie eingeben, verlässt jemals den Tab.