How to set background-image: linear-gradient to SVG?

Question

css

background-image: linear-gradient(-11deg, #83C5E5 0%, transparent 14.5%, transparent 62%, #83C5E5 76.5%, #83C5E5), linear-gradient(65deg, #83C5E5 31%, transparent 43.5%, transparent 57%, #83C5E5 76.5%, #83C5E5), linear-gradient(30deg, #83C5E5 12%, transparent 12.5%, transparent 87%, #83C5E5 87.5%, #83C5E5), linear-gradient(150deg, #83C5E5 12%, transparent 12.5%, transparent 87%, rgb(131, 197, 229) 87.5%, rgb(131, 197, 229)), linear-gradient(60deg, rgb(254, 85, 104) 25%, transparent 25.5%, transparent 75%, rgb(254, 85, 104) 75%, rgb(254, 85, 104)), linear-gradient(60deg, rgb(254, 85, 104) 25%, transparent 25.5%, transparent 75%, rgb(254, 85, 104) 75%, rgb(254, 85, 104));

instead of bacground-color I use fill: #4D756D;
and background-image: linear-gradient how to do?
Thank you!

Answer 1

<svg>
  <defs>
    <linearGradient id='myGradient'>
      <stop offset='0%' stop-color='red'></stop>
      <stop offset='100%' stop-color='blue'></stop>
    </linearGradient>
  </defs>
  <circle cx='100' cy='100' r='50' fill='url(#myGradient)' />
</svg>

codepen.io/imdmitrykravchenko/pen/JGxBwB