Efeito :hover com CSS, simples e muito funcional

Esse é um truque muito simples e que ajuda a não ter que pensar o :hover a cada link que temos no site.

Para isso vamos usar a propriedade filter do CSS, da seguinte forma:

a:hover {
    filter: brightness( 50% );
}

Nesse exemplo acima, a cor aplicada aos links terão seu brilho (brightness) reduzido em 50% quando o mouse passar sobre eles.

Para melhorar ainda mais, você pode adicionar uma transição nos links, da seguinte forma:

a {
    transition: all 0.2s ease-in-out;
}

Simples assim e muito útil. O que vocês acham?