<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="0" height="0" display="none">
    <symbol id="check" viewBox="0 0 20 20">
      <path fill="url(#color001)" d="M.9 10.2c1.6 1.4 4.9 5.5 5.6 8.9.1.5 1.1.6 1.4-.1 3.3-7.7 5.1-12.2 9.8-16.8C19.4.5 18.8 0 17.2.8c-3.7 2-7.5 7-10 11.7-2.7-2.4-3.5-2.5-5-3.1-1.6-.6-1.5.5-1.3.8z"/>
      <defs>
        <linearGradient id="color001" x1="20" y1="20" x2="0" y2="0" gradientUnits="userSpaceOnUse">
        <stop stop-color="#256eaa"/>
        <stop offset="1" stop-color="#39a2f9"/>
        </linearGradient>
      </defs>
    </symbol>
    <symbol id="check2" viewBox="0 0 20 20">
      <path d="M.9 10.2c1.6 1.4 4.9 5.5 5.6 8.9.1.5 1.1.6 1.4-.1 3.3-7.7 5.1-12.2 9.8-16.8C19.4.5 18.8 0 17.2.8c-3.7 2-7.5 7-10 11.7-2.7-2.4-3.5-2.5-5-3.1-1.6-.6-1.5.5-1.3.8z"/>
    </symbol>
</svg>


check: <svg width="30" height="30"><use href="#check"></use></svg>
<hr>
check2: <svg fill="blue" width="30" height="30"><use href="#check2"></use></svg>

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.