Как при наведении на ссылку затемнить другие ссылки

Как сделать так, чтобы при наведении на одну из ссылок в навбаре она оставалась прежнего цвета, а остальные ссылки затемнялись?

Пример:

Код навбара:

    <header>
        <img src="assets/logo.svg" alt="logo" class="logo">
        <nav>
            <ul class="nav_links">
                <li><a href="#">Home</a></li>
                <li><a href="#">Projects</a></li>
                <li><a href="#">About Us</a></li>
            </ul>
        </nav>
    </header>

li, a, button {
    font-family: Josefin Sans;
    font-weight: normal;
    font-size: 15px;
    letter-spacing: 0.31em;
    color: #DEDEDE;
    text-decoration: none;
}

header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 50px 5%;
    height: 20px;
    border-bottom: 1px solid #21223F;
}

.logo {
    cursor: pointer;
    width: 160px;
}

.nav_links {
    list-style: none;
}

.nav_links li {
    display: inline-block;
    padding: 8px 70px;
    transition: 0.3s;
}

.nav_links a {
    transition: 0.3s;
}