JSFiddle - React, Tailwind, and code Playground

HTML

<div>●</div>

CSS

div {
    font-size: 70px;
    font-family: Arial;
    margin: 10px;
}

div:hover::before {
    content: '〇';
    font-size: 50px;
    line-height: 60px;
    position: absolute;
    top: 26px;
    left: 6px;
    color: #75AADD;
    
    -webkit-animation: burn 2s infinite linear;
       -moz-animation: burn 2s infinite linear;
         -o-animation: burn 2s infinite linear;
            animation: burn 2s infinite linear;   
}

@-webkit-keyframes burn {
    0% { color: #75AADD; }
    50% { color: #407EC8; }
    100% { color: #75AADD; }
}

@-o-keyframes burn {
    0% { color: #75AADD; }
    50% { color: #407EC8; }
    100% { color: #75AADD; }
}

@-moz-keyframes burn {
    0% { color: #75AADD; }
    50% { color: #407EC8; }
    100% { color: #75AADD; }
}

@keyframes burn {
    0% { color: #75AADD; }
    50% { color: #407EC8; }
    100% { color: #75AADD; }
}