Я нарисовал круг с помощью SVG. Этот круг имеет эффект парения. Я хотел бы добавить ссылку в круг и текст ссылки, чтобы изменить цвет вместе с эффектом наведения.

svg#circle {
  height: 250px;
  width: 250px;
}

circle {
  stroke-dasharray: 700;
  stroke-dashoffset: 700;
  stroke-linecap: butt;
  -webkit-transition: all 2s ease-out;
  -moz-transition: all 2s ease-out;
  -ms-transition: all 2s ease-out;
  -o-transition: all 2s ease-out;
  transition: all 2s ease-out;
}

circle:hover {
  fill: pink;
  stroke-dashoffset: 0;
  stroke-dasharray: 700;
  stroke-width: 10;
}

<svg id="circle">
        <circle cx="125" cy="125" r="100" stroke="darkblue" stroke-width="3"     fill="green" />
     </svg>