Command Palette

Search for a command to run...

Supprimer un arrière-plan d'image dans le navigateur : ce que fait un dissolvant de clé de couleur

Supprimer un arrière-plan d'image dans le navigateur : ce que fait un dissolvant de clé de couleur

T
Toolz Team
|Jul 4, 2026|17 min read

J'avais besoin de quarante photos de produits nettoyés pour une page promotionnelle WP Adminify et je ne voulais pas payer par image ou télécharger les maquettes sur le serveur de quelqu'un avant d'être publics. J'ai donc construit un dissolvant d'arrière-plan dans toolz.dev, je lui ai jeté ma première photo et je l'ai regardé faire un trou au milieu du produit.

La photo était une boîte de plugins blanches sur un bureau blanc. L'outil a retiré le bureau. Il a également retiré la boîte, car la boîte était le même blanc que le bureau. J'avais supposé que je construisais quelque chose d'intelligent et en forme d'IA. J'avais en fait construit quelque chose de beaucoup plus simple, et le trou dans mon produit m'a appris exactement ce que c'était - et, plus utilement, exactement quand il fonctionne magnifiquement et quand il échoue.

Ce guide est cette leçon écrite. Il est honnête de savoir ce qu'un dissolvant de couleur basé sur un navigateur peut faire, car un outil qui échoue tranquillement sur les cheveux et les sujets de la même couleur est pire que aucun outil du tout si vous ne connaissez pas ses bords. Tout ici fonctionne côté client - votre image est décodée, traitée et téléchargée sans jamais quitter l'onglet.

tl;dr : le dissolvant d'arrière-plan Échantillonnez la couleur dans le coin supérieur gauche de votre image et supprime chaque pixel près de cette couleur, laissant la transparence derrière (png). C'est une clé de couleur, pas une découpe d'IA. Cela signifie qu'il s'agit d'un fond instantané, privé et vraiment excellent sur des arrière-plans plats et de couleur unie - photos de produits, logos, illustrations plates, captures d'écran - et vraiment mauvaises sur les photos occupées, les dégradés, les cheveux et tout sujet qui partage une couleur avec son arrière-plan. Tournez le tolérance Cursez vers le haut pour en retirer davantage, vers le bas pour protéger les bords. Besoin de convertir le résultat en JPG par la suite ? le Convertisseur de format d'image Cela fait, mais vous perdez la transparence.


Quel type de suppression d'arrière-plan s'agit-il ?

Il existe deux familles d'outils très différentes qui se disent toutes les deux "supprimantes d'arrière-plan", et choisir la mauvaise pour votre image est la raison la plus courante pour laquelle les gens sont frustrés.

La première famille est Segmentation d'IA. Un modèle d'apprentissage automatique formé sur des millions de photos étiquetées regarde votre image, décide "C'est un chien, c'est un canapé derrière le chien", et trace le chien. C'est ce que font Remove.bg et les outils cloud payants. Il gère les cheveux, la fourrure et les arrière-plans encombrés car il comprend sujets, pas seulement les couleurs. Le coût : il télécharge généralement votre image sur un serveur, il a besoin de ce modèle formé et il est plus lent.

La deuxième famille est un Clé de couleur — Parfois appelé Chroma Keying, la même idée qu'un écran vert dans le film. Il ne comprend pas du tout ce qu'il y a sur votre photo. Il choisit une couleur d'arrière-plan et supprime chaque pixel près de cette couleur. Le dissolvant d'arrière-plan Toolz.dev est ce deuxième type. Il échantillonne le pixel dans le coin supérieur gauche De votre image, traite cela comme "l'arrière-plan", et parcourt chaque pixel : est-ce suffisamment proche de la couleur du coin pour supprimer ?

Ni l'un ni l'autre n'est meilleur dans l'ab Ils sont bons à différentes images. Une fois que vous pouvez savoir quelle image vous tenez, vous arrêterez de combattre l'outil.


Comment le dissolvant de clé de couleur décide-t-il quoi supprimer ?

Le mécanisme vaut la peine d'être compris car il explique chaque succès et chaque échec que vous en tirerez.

Lorsque vous appuyez sur Aperçu, l'outil lit la couleur du pixel du coin supérieur gauche. Appelez-le la référence. Ensuite, pour chaque pixel de l'image, il s'ajoute à la distance entre ce pixel et la référence sur les trois canaux de couleur :

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

C'est une somme simple des distances rouge, verte et bleue (une distance de Manhattan, si vous voulez le terme). Si le total difference est en dessous de votre tolérance Réglage, l'alpha du Pixel est mis à zéro, il devient transparent. Si c'est au-dessus, le pixel reste.

Trois conséquences ne sont pas issues de cette formule, et elles sont toute l'histoire :

Premièrement, Le coin doit être en arrière-plan. L'outil suppose que le pixel en haut à gauche fait partie de ce que vous voulez disparaître. Si votre sujet atteint ce coin, vous indiquez à l'outil que votre sujet est l'arrière-plan. Recadrer ou recadrer pour que le coin soit propre.

Cousin germain à ça : L'arrière-plan doit être à peu près d'une couleur. Un balayage de studio blanc plat est d'une couleur. Un café flou, un dégradé de ciel, un bureau en bois avec du grain - ce sont de nombreuses couleurs, et l'outil ne connaissait que celui du coin. Il supprimera les parties qui correspondent et laisseront le reste comme une frange laide.

Deuxièmement, Toute couleur de sujet qui correspond à l'arrière-plan est également supprimée. Ma boîte blanche sur le bureau blanc est la défaillance canonique. Une personne en chemise grise contre un mur gris perd la chemise. L'outil n'a aucune idée que la chemise est "sujet" - elle ne voit que le gris près du gris de référence.


Lorsque cet outil est tout à fait correct

Je n'arrête pas d'y parvenir malgré les limites, car pour un ensemble d'images spécifique et très commun, il est plus rapide et plus privé que tout ce qui est basé sur le cloud. Il brille sur :

Photos du produit sur un balayage solide. Tirez sur un fond blanc ou uni de couleur unie - une feuille de papier, un rouleau de fond uni, une boîte à lumière - et la découpe est propre en un clic. Il s'agit du flux de travail du commerce électronique : les images de produits à fond blanc sont effectivement requises sur Amazon et sont attendues sur Etsy et eBay.

Logos et graphismes plats. Un logo exporté sur un fond uni, une illustration plate, une icône, c'est déjà fait de quelques couleurs plates, ce qui est exactement ce que veut une clé de couleur.

Captures d'écran et captures d'interface utilisateur. Une capture d'écran avec une barre d'outils uniforme ou une couleur de toile se détache proprement lorsque vous n'avez besoin que du contenu.

Tout ce que vous auriez un écran vert. Si vous pouvez contrôler le tournage et mettre votre sujet contre une couleur plate et contrastée que le sujet fait non Portez-le, cet outil est de qualité professionnelle.

Quand utiliser autre chose

Soyez honnête avec vous-même à propos de l'image avant de perdre dix minutes sur les curseurs de tolérance :

Photos de personnes aux cheveux visibles. Les brins fins sur un arrière-plan sont le problème le plus difficile sur le terrain, et une touche de couleur ne peut pas le faire. Accédez à un outil d'IA.

Arrière-plans occupés ou dégradés. Rues, chambres, ciel, bokeh — de nombreuses couleurs, une référence, une frange garantie.

Les sujets qui partagent la couleur de fond. Aucun paramètre de curseur ne corrige un objet blanc sur le blanc. Reprise de l'arrière-plan contrastant ou de la segmentation.


Comment supprimer un arrière-plan sur Toolz.dev, étape par étape

L'interface est délibérément petite. Il n'y a pas de compte, pas de téléchargement, pas de filigrane.

Étape 1 : Ouvrir l'outil

aller au dissolvant d'arrière-plan. Le tout se charge en tant que page, il n'y a pas de modèle à télécharger ni d'appel de serveur.

Étape 2 : Téléchargez votre image

Cliquez sur la zone de dépôt et choisissez un fichier (JPG, PNG ou WebP fonctionne). Il est lu directement dans la page. Vérifiez que le Le coin supérieur gauche est le fond — C'est la seule règle de cadrage qui compte. Si votre sujet est coincé dans ce coin, le résultat sera erroné, peu importe ce que vous ferez ensuite.

Étape 3 : Définissez la tolérance, puis prévisualisez

le tolérance Le curseur va de 0 à 200 et commence à 50. La faible tolérance supprime uniquement les couleurs très proches du coin (sûr, mais peut laisser un halo de pixels proches de l'arrière-plan). La haute tolérance supprime une plus grande gamme de couleurs (balayage plus propre, mais ronge les bords et toute couleur de sujet correspondante). choquer avant-prem Et regardez le damier - ce modèle est la zone transparente.

Étape 4 : Régler

Si l'arrière-plan survit, faites un effort de tolérance vers le haut et prévisualisez à nouveau. Si votre sujet perd ses bords ou fait des trous, poussez-le vers le bas. Vous recherchez le paramètre qui efface l'arrière-plan sans toucher le sujet. Pour un fond plat bien tiré, il existe généralement une large gamme confortable qui fonctionne.

Étape 5 : Télécharger le PNG

s'adapter Télécharger PNG. La sortie est toujours PNG car le format Web est le format Web courant qui prend en charge la transparence, c'est tout. Le fichier est généré dans le navigateur et enregistré directement sur votre machine.


Clé de couleur vs découpe AI : laquelle souhaitez-vous réellement ?

Remover de clé de couleur (cet outil) Segmentation d'IA (supprimer.bg, etc.)
Comment ça décide Supprime les couleurs près du coin supérieur gauche reconnaît le sujet et le trace
Meilleures images Arrière-plans plats, solides et monochromes Photos occupées, personnes, cheveux, encombrer
Cheveux et bords fins humble humeur
Le sujet partage la couleur de fond Échecs (supprime les deux) généralement bien
Où ça marche 100 % dans votre navigateur Charge généralement sur un serveur
intimité L'image ne quitte jamais l'onglet Image envoyée à un tiers
allure Instantané, aucune charge de modèle plus lent ; dépend du service
coûter Gratuit, illimité Souvent par image ou plafonné
production PNG avec transparence PNG avec transparence

La ligne qui le décide pour moi est Confidentialité Plus Fonds plats. Si je contrôle le tournage, je contrôle l'arrière-plan, puis la touche de couleur honnête et ennuyeuse bat l'outil intelligent d'IA sur la vitesse et sur le fait de ne jamais envoyer mes actifs non publiés nulle part.


Quelques habitudes qui obtiennent des résultats plus propres

Tirez sur l'outil. Le plus grand levier n'est pas le logiciel, c'est l'entrée. Un sujet sur un fond uni, contrasté et uniformément éclairé en un seul clic. Cinq minutes pour organiser une feuille de papier bat une heure de lutte cycliste.

Gardez le coin propre. Cadre afin que le pixel en haut à gauche soit sans ambiguïté en arrière-plan. C'est la seule référence de l'outil.

Le contraste bat la tolérance. Si votre sujet et votre arrière-plan sont proches en couleur, aucun curseur ne vous enregistre, modifiez l'arrière-plan, pas le paramètre.

Redimensionnez avant, compressez après. Si l'image finale est diffusée sur le Web, exécutez la découpe à travers le Redimensionnement d'images outil pour les dimensions exactes, puis Compresseur d'images pour réduire le fichier. Faites-les après Retrait afin que vous ne compressez pas les détails de bord dont vous avez encore besoin.

Gardez-le en png jusqu'à ce que vous ayez Chaque étape intermédiaire doit rester PNG afin que la transparence survive. Seulement aplatir en JPG pour la destination finale si cette destination ne peut pas prendre de PNG et savoir que la zone transparente devient un remplissage solide lorsque vous le faites.


Questions fréquentes

Cet outil utilise-t-il l'IA pour supprimer les arrière-plans ?

Non, et c'est délibéré. Il s'agit d'un dissolvant de clé de couleur : il échantillonne la couleur du coin supérieur gauche et supprime les pixels à proximité, entièrement dans votre navigateur. Cela le rend instantané et complètement privé, mais cela signifie qu'il fonctionne sur des arrière-plans plats et solides plutôt que sur des photos complexes comme le ferait un modèle d'IA. La note de l'outil en dit autant - pour les arrière-plans occupés, une découpe d'IA est la meilleure.

Pourquoi a-t-il supprimé une partie de mon sujet ?

Parce qu'une partie de votre sujet était proche de la couleur de l'arrière-plan. L'outil supprime par couleur, et non en reconnaissant quel est le sujet, donc une chemise blanche sur un mur blanc, ou un produit de la même teinte que le bureau sur lequel il se trouve, est supprimé avec l'arrière-plan. Le correctif est un arrière-plan qui contraste avec le sujet, pas un paramètre de curseur différent.

Qu'est-ce que le curseur de tolérance change réellement ?

C'est la limite de la différence entre un pixel et la couleur du coin et d'être supprimés. La faible tolérance ne supprime que les couleurs presque identiques (sûr, mais peut laisser un halo). La haute tolérance élimine une plus large gamme (nettoyant sur un balayage plat, mais mange des bords). Il fonctionne de 0 à 200 et est par défaut à 50 ; prévisualisez et ajustez jusqu'à ce que l'arrière-plan s'efface sans toucher le sujet.

Pourquoi la sortie est-elle toujours un PNG ?

Parce que PNG prend en charge la transparence et non JPG. Supprimer un arrière-plan signifie rendre les pixels transparents, et seul un format avec un canal alpha peut le stocker. Si vous exportez la même image que JPG, la zone transparente se résorbe en une couleur unie, généralement blanche.

Puis-je supprimer l'arrière-plan d'une photo d'une personne ?

Seulement s'il s'agit d'un cliché de style studio propre sur un fond plat et contrasté et que la personne n'est pas proche de cette couleur. Pour les photos de tous les jours avec des cheveux sur un fond réel, cet outil laissera Fringe, c'est le cas où un outil de segmentation de l'IA gagne sa vie.

Mon image est-elle téléchargée quelque part ?

non . L'image est décodée et traitée à l'intérieur de la page à l'aide de la toile du navigateur, et le PNG est généré localement lors de votre téléchargement. Rien n'est envoyé à un serveur, c'est pourquoi il est sûr d'utiliser les photos et les actifs qui ne sont pas encore publics.

Comment supprimer un fond blanc d'une image ?

C'est le cas pour lequel l'outil est conçu. Un fond blanc est plat et uniforme, de sorte que l'échantillon d'angle atterrit sur un blanc pur et une tolérance modérée efface tout le champ en une seule passe. Déposez l'image, vérifiez l'aperçu et la tolérance de pousser vers le haut uniquement si une faible jante grise survit près des bords - les prises de vue en studio et les logos numérisés ont souvent un dégradé légèrement blanc cassé plutôt que de vrais #FFFFFF. La seule chose à regarder est le blanc à l'intérieur de votre sujet : une tasse blanche ou une chemise blanche disparaîtra avec l'arrière-plan, car l'outil correspond à la couleur plutôt qu'à la reconnaissance d'objets.

Pourquoi ma découpe a-t-elle un bord blanc ou coloré autour ?

Cette frange est anti-aliasing. L'image d'origine a mélangé les pixels du bord du sujet dans la couleur de fond pour rendre le contour lisse, de sorte que ces pixels mélangés ne sont ni sujets ni arrière-plan - ils se trouvent juste en dehors du seuil de tolérance et survivent à la suppression. Augmenter un peu la tolérance mange généralement le halo, bien que pousser trop loin commence à mordre le sujet lui-même. Si la frange persiste à chaque paramètre, l'image sous-jacente manque simplement de contraste suffisant à la limite, et une prise de vue sur un fond plus contrasté fixera en une seconde ce qu'aucun curseur ne peut.

Comment puis-je mettre une couleur unie derrière mon sujet de découpe par la suite ?

Placez le PNG transparent sur un calque coloré dans n'importe quel éditeur ou exportez vers JPG via le Convertisseur de format d'image, qui remplit la zone transparente avec une couleur d'arrière-plan. Pour une utilisation sur le Web, un PNG transparent déposé sur un fond CSS est généralement le chemin le plus propre.


arrivée

L'erreur que j'ai commise lors de cette première prise de vue de produit - en attendant une découpe d'IA et en obtenant une clé de couleur - est l'erreur que presque tout le monde fait avec les suppressions d'arrière-plan du navigateur, et elle est entièrement évitable une fois que vous savez ce que vous détenez. Cet outil fait une chose : il supprime la couleur de fond et laisse la transparence. Donnez-lui un arrière-plan plat et contrasté et il est rapide, gratuit, illimité et privé d'une manière qu'aucun outil basé sur le téléchargement ne peut correspondre. Donnez-lui des cheveux contre une rue bondée et cela vous décevra, et maintenant vous savez à la place pour un autre outil.

Commencez par le dissolvant d'arrière-plan. Nettoyez le coup avec Redimensionnement d'images et le Compresseur d'images, et convertir les formats avec le Convertisseur de format d'image Si vous en avez besoin. Tout cela s'exécute dans votre navigateur - rien de ce que vous déposez ne quitte jamais l'onglet.

Frequently Asked Questions

No, and that is deliberate. It is a color-key remover: it samples the top-left corner color and deletes pixels close to it, entirely in your browser. That makes it instant and completely private, but it means it works on flat, solid backgrounds rather than on complex photos the way an AI model would. The tool's own note says as much — for busy backgrounds, an AI cutout is the better fit.

Comments

0 comments

0/2000 characters

No comments yet. Be the first to share your thoughts!