При разработке сайтов или же по мере использования html вёрстки, часто возникает необходимость убрать подчёркивание у ссылок. Добиться этого результата можно одним простым свойством: a { text-decoration: none; } Но на этом не все хотят останавливаться и идут дальше, а именно, бывают ситуации, когда необходимо сделать кастомную ссылку, например такую: Если присмотреться, то можно заметить, что подчёркивание не совсем обычного цвета...

Эффект наведения ссылки с изменением цвета справа налево Лично мне нравится использовать этот эффект для ссылок в навигации. Ссылка начинается одним цветом без подчеркивания. Затем, при наведении курсора, справа появляется новый цвет, а слева - подчеркивание. Красиво, правда? Там происходит много движения, поэтому вы можете рассмотреть последствия доступности и обернуть все это в prefers-reduced-motion запрос, чтобы заменить его чем-то более тонким для тех, кто чувствителен к движению. Вот как это работает...