Сделать значок вращающимся при наведении в React

В моем проекте есть несколько потрясающих шрифтов значков, заключенных в тег «a». Я хочу, чтобы они вращались при наведении, но не совсем понимаю, как это реализовать.

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { library } from '@fortawesome/fontawesome-svg-core';
import { fab } from '@fortawesome/free-brands-svg-icons';
import logo from "../images/logo.png";

library.add(fab)

function Footer() {
    return (
        <footer>
            <div className = "socials">
                <a href = "/">
                    <FontAwesomeIcon icon = {["fab", "facebook"]}/>
                </a>
                <a href = "/">
                    <FontAwesomeIcon icon = {["fab", "instagram"]}/>
                </a>
                <a href = "/">
                    <FontAwesomeIcon icon = {["fab", "twitter"]}/>
                </a>
            </div>
            <div>
            <a href = "#home"><img src = {logo} alt = "Crepes&Burgers"/></a>
                </div>
        </footer>
    );
}

export default Footer;