Buongiorno, vorrei variare il colore di alcuni elementi decorativi realizzati con più svg in background senza dover creare più immagini di diverso colore da sostituire.
Ho trovato vari tutorial che fanno riferimento all'utilizzo dei filtri ( es:
filter: invert(61%) sepia(17%) saturate(1334%) hue-rotate(202deg) brightness(96%) contrast(90%); )
però sono sempre riferiti ad un elemento <svg></svg> inserito nell'html a cui viene associata una classe css che contiene il filtro.
Ma il mio svg in background fa già parte di una classe css e se provo ad aggiungerci i parametri del filtro mi cambia il colore non dell'svg ma di tutto il div a cui è associata la classe.
Volevo sapere per cambiare colore all' svg con i filtri devo necessariamente togliere il css dal background oppure c'è un modo per farlo comunque?
Se la risposta è si mi potreste indicare come fare per favore?
Vi posto quello che ho fatto io, la sintassi è sbagliata, ma non so quale sia quella corretta..
.green_background {
width:600px;
height:800px;
background-image: url("../img/flowers.svg");
filter: invert(61%) sepia(17%) saturate(1334%) hue-rotate(202deg) brightness(96%) contrast(90%);
background-repeat: no-repeat;
padding:0;
margi:0;
color:#fff;
}
Grazie mille per l'attenzione
Rispondi quotando