CSS Farbcode in "background-image" nicht möglich?

[Pfandfinder]

ich habe diesen Code gefunden für externe Links: https://christianoliff.com/blog/styling-external-links-with-an-icon-in-css/

meine Link-farbe ist aber eine andere und ich habe daher in "background-image" erstmal hinzugefügt:

color='blue'

aber wieso nimmt der nur Wörter als Farbe ? ich möchte #225C76 nehmen, doch dann ist das Symbol einfach unsichtbar...

background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' color='#225C76' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z'/%3E%3Cpath fill-rule='evenodd' d='M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'/%3E%3C/svg%3E");

https://jsfiddle.net/2p6btru8/

 

[SFFox]

Also dein Problem ist wohl das Missverständnis, dass im SVG das "color" ein Attribut ist und nichts mit CSS zu tun hat. Du kannst hex Farbwerte dort nutzen, musst sie aber ohne # angeben.

In css gibt es die Eigenschaft "background-image", die nimmt aber auch gezielt nur Images entgegen und keine Farbe.

Eine Hintergrund-Farbe in CSS kannst du gezielt mit "background-color" oder allgemein mit "background" setzen.