recolorer un SVG

Changeur de couleurs SVG

Toutes les couleurs du fichier réunies dans une seule palette — modifie n'importe laquelle et vois le résultat aussitôt, ou confie le tout au CSS avec currentColor.

recolorer un SVG

☞ tout se passe dans ton navigateur — rien n’est envoyé

Dépose ton SVG ici

ou clique pour parcourir — SVG uniquement

une palette, toutes les couleurs

Où se cachent les couleurs dans un SVG

Une couleur peut se trouver sur un attribut fill ou stroke, dans un style en ligne, ou dans une feuille de style intégrée au fichier — et un export d'Illustrator ou de Figma choisit en général la dernière option. C'est pour cela que modifier un SVG à la main dans un éditeur de texte laisse si souvent passer quelques formes.

Cet outil lit les trois endroits, plus les arrêts de dégradé et les couleurs de filtre, et les rassemble dans une seule palette. Change un échantillon et chaque occurrence de cette couleur change avec lui, où qu'elle ait été écrite.

trois étapes

Comment changer les couleurs d'un SVG

01

Dépose le SVG

Choisis un fichier .svg — il reste sur ton appareil.

02

Modifie un échantillon

Chaque couleur du fichier en a un, avec sa fréquence d'utilisation.

03

Télécharge

Seules les couleurs changent ; les formes restent intactes.

réponses rapides

FAQ du changeur de couleurs SVG

Que fait réellement currentColor ?

Il dit à la forme d'utiliser la couleur de texte de l'élément qui la contient. Une icône en currentColor devient blanche dans un bouton sombre et grise dans un texte atténué, sans second fichier ni la moindre règle CSS supplémentaire. C'est la façon standard dont les bibliothèques d'icônes livrent leurs SVG.

Pourquoi ne puis-je pas modifier le dégradé ?

Un dégradé est une référence vers une définition ailleurs dans le fichier, pas une couleur : le remplacer supprimerait le dégradé au lieu de le recolorer. Les couleurs d'arrêt à l'intérieur du dégradé apparaissent bien dans la palette — modifie celles-là.

La palette est vide

C'est que le fichier n'a pas de couleur propre. Cela veut dire en général que le dessin est déjà en currentColor ou qu'il hérite sa couleur d'une feuille de style extérieure au fichier. Ouvre-le dans la visionneuse SVG pour voir le source.

Deux teintes identiques partagent un seul échantillon

Les couleurs sont regroupées selon ce qu'elles valent réellement : #FFF, #ffffff et white forment une seule entrée. La modifier les met toutes à jour, chacune dans la forme où elle était écrite.

Mon fichier est-il envoyé quelque part ?

Non. Le fichier est analysé et réécrit dans ton navigateur.