<svg viewBox="0 0 461 467" fill="none" xmlns="http://www.w3.org/2000/svg">
<style>
@media (prefers-color-scheme: dark) {
    path {
        fill: white;
    } 
}
@media (prefers-color-scheme: light) {
    path {
        fill: black;
    } 
}
svg {
    transition: fill 250ms linear;
    cursor: pointer;
}
svg:hover .green {fill: #06D6A0 }
svg:hover .yellow { fill: #FFBB00 }
svg:hover .magenta { fill: #FF0075 }
svg:hover .blue { fill: #0076FF }
</style>

<path class="green" d="M389.431 465.611C421.673 433.443 443.246 393.222 449.403 353.796C455.56 314.369 445.797 278.966 422.262 255.376L300.691 376.663L389.431 465.611Z"/>
<path class="yellow" d="M71.5738 466.306C39.331 434.138 17.7582 393.917 11.6011 354.49C5.44395 315.064 15.2069 279.661 38.7422 256.07L160.314 377.358L71.5738 466.306Z"/>
<path class="magenta" d="M0.673946 122.184C0.727229 167.729 18.8709 211.387 51.1137 243.554L51.1168 243.551L172.673 364.823C204.84 332.58 222.882 288.88 222.829 243.335C222.775 197.79 204.632 154.132 172.389 121.964L172.386 121.967L50.8296 0.695312C18.6622 32.9381 0.620662 76.6388 0.673946 122.184Z"/>
<path class="blue" d="M460.329 121.488C460.276 167.033 442.132 210.692 409.89 242.859L409.886 242.855L288.33 364.127C256.163 331.884 238.121 288.183 238.175 242.638C238.228 197.094 256.372 153.435 288.614 121.268L288.618 121.271L410.174 0C442.341 32.2428 460.383 75.9435 460.329 121.488Z"/>
</svg>