[Malleys]

Цвет вы можете уточнить при помощи CSS.

<style>
div circle {
  transition: 500ms;
}

div:nth-child(1) circle:hover {
  fill: deeppink;
}

div:nth-child(2) circle:hover {
  fill: gold;
}

div:nth-child(3) circle:hover {
  fill: yellowgreen;
}
</style>

<!-- Здесь типа сгенерировано 3 одинаковых блока  -->
<div>
  <svg height="100" width="100">
    <circle cx="50" cy="50" r="50">
  </svg>
</div>
<div>
  <svg height="100" width="100">
    <circle cx="50" cy="50" r="50">
  </svg>
</div>
<div>
  <svg height="100" width="100">
    <circle cx="50" cy="50" r="50">
  </svg>
</div>