Как сделать такой эффект для кнопки при нажатии?

Question

[Nazi]

круг взял с fontawesome

Answer 1

[outcastik]

.button .icon {
    position: relative;
}
.button:active .icon {
    top: 1px or more
}

или транслейт

Answer 2

[Никита Ткач]

Какой именно эффект ? То что вы скинули не что не понятно на этих картинках ) Вообще hover в помощь

Comments

[Nazi]

при клике на кнопку у нас должен двигаться круг вниз

Answer 3

[Алексей]

Через JS ловите клик по кнопке и добавляйте класс который будет анимировать иконку.

Answer 4

[HamSter]

Примерно так:

$(button).on('click', function(e){
  e.preventDefault();
  $(this).addClass('animate');
});

button.animate {
  transform: translateY(10px);
}