When importing svg images with color into Mapbox Studio, they appear as black and white. The troubleshooting website mentions:
If your SVG appears black after adding to Mapbox Studio, it may be due to using style properties in tags instead of inline style attributes. Mapbox Studio does not support style properties added in tags.
For those new to editing svgs: How do you assign style properties inline?
Below is the svg code:
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22.56 28.71">
<defs>
<style>
.cls-1{fill:#f15824;}
</style>
</defs>
<title>black_only_v3</title>
<g id="svg_9" data-name="svg 9">
<g id="svg_5" data-name="svg 5">
<g id="svg_6" data-name="svg 6">
<path id="svg_7" data-name="svg 7" d="M1.55,15.54C2.71,19,5.46,24,12,28.71,18.56,24,21.3,19,22.45,15.54a11.23,11.23,0,0,0,.83-4.14.59.59,0,0,0,0-.12h0a11.28,11.28,0,1,0-22.56,0s0,0,0,.12A11.19,11.19,0,0,0,1.55,15.54ZM12,2.79a8.7,8.7,0,1,1-8.7,8.7A8.69,8.69,0,0,1,12,2.79Z" transform="translate(-0.72 0)"/>
</g>
</g>
<polygon id="svg_8" data-name="svg 8" class="cls-1" points="11.31 8.14 4.42 11.58 9.59 11.58 11.31 15.03 18.19 11.58 13.03 11.58 11.31 8.14"/>
</g>
</svg>