Wie ändert man in einem als img eingebundenen SVG mit CSS die Farbe?

Um die Farbe eines in einem `<img>`-Tag eingebundenen SVG mit CSS zu ändern, gibt es einige Einschränkungen, da CSS nicht direkt auf den Inhalt eines SVGs zugreifen kann, das als Bild eingebunden ist. Hier sind einige Alternativen:

1. **SVG direkt im HTML einfügen**: Anstatt das SVG als Bild einzubinden, kannst du den SVG-Code direkt in dein HTML-Dokument einfügen. Dadurch kannst du die Farben mit CSS ändern. Beispiel:

```html
<svg class="my-svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<circle cx="50" cy="50" r="40" fill="currentColor" />
</svg>
```

Und dann in CSS:

```css
.my-svg {
color: red; /* Ändert die Farbe des Kreises */
}
```

2. **SVG als Hintergrundbild verwenden**: Du kannst das SVG als Hintergrundbild in CSS verwenden und die Farbe durch Filter ändern. Beispiel:

```css
.my-element {
background-image: url('path/to/your.svg');
filter: hue-rotate(90deg); /* Ändert die Farbe */
}
```

3. **SVG mit CSS-Variablen**: Wenn du das SVG selbst bearbeitest, kannst du CSS-Variablen verwenden, um die Farben zu steuern. Beispiel:

```html
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<circle cx="50" cy="50" r="40" fill="var(--circle-color)" />
</svg>
```

Und in CSS:

```css
:root {
--circle-color: blue; /* Setzt die Farbe */
}
```

Wenn du das SVG als `<img>`-Tag verwendest, sind diese Methoden nicht anwendbar, und du müsstest das SVG selbst bearbeiten oder eine der oben genannten Alternativen verwenden.