Diese Seite gibt es auch auf Deutsch.
SVG Tool (Recolor and Power Apps Code)
Upload an SVG, change its colors and get EncodeUrl code that works in the Power Apps image control.
The SVG tool reads colors from fill, stroke, style and CSS names and replaces them in a single pass, so you can even swap two colors. You change the size via width and height while the viewBox stays, so the graphic scales cleanly. The copied code always contains xmlns, without it the image control stays empty (tip 86).
Free. You enter your email address once, then all tools are unlocked. Your data is processed locally in your browser.
How it works
- Pick an SVG or drag it onto the drop area.
- Adjust colors, optionally resize or optimize.
- Copy the Power Apps code and paste it into the Image property.
Example: SVG as a Power Apps image source
"data:image/svg+xml;utf8," & EncodeUrl(
"<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>
<circle cx='12' cy='12' r='10' fill='#40c7c0'/>
</svg>"
)Frequently asked questions
Is the SVG tool free?
Yes.
Are my graphics uploaded?
No, everything runs locally in your browser.
Why EncodeUrl instead of plain SVG?
Power Apps expects a URL-encoded data URI for inline SVG. EncodeUrl encodes special characters so the image renders reliably.
Why does my image stay empty?
Usually xmlns is missing in the svg tag. The tool adds it to the copied code and the download.
Can I set colors dynamically?
Yes. Replace the hex value in the copied code with a variable, for example with Substitute() or string concatenation (tip 181).
Where do I paste the code?
Into the Image property of an image control in a canvas app.