JSFiddle - React, Tailwind, and code Playground

by maximiloi

HTML

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="80px" viewBox="0 0 62 80" enable-background="new 0 0 62 80" xml:space="preserve">
  <symbol id="icon-location" viewBox="0 0 62 80">
    <path fill-rule="evenodd" clip-rule="evenodd" fill='none' stroke='currentColor' stroke-width="6" d=" M30.9999,3.4994c14.9117,0,27,12.0881,27,27c0,14.912-12.0883,27.0002-27,27.0002s-27-12.0882-27-27.0002 C3.9999,15.5875,16.0882,3.4994,30.9999,3.4994z"/>
  </symbol>
</svg>

<svg class="icon">
  <use xlink:href="#icon-location"></use>
</svg>

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="101" height="85" viewBox="0 0 101 85"><image width="101" height="85"...

CSS

.icon {
  color: hotpink;
}